[이슈해결] The `purge`/`content` options have changed in Tailwind CSS v3.0

 

✔️ purge options이 사라졌다

원래 Tailwind V2를 쓸 때에는 tailwind.config.js에서 purge option을 지정해야했는데 V3이 되면서 더이상 purge options을 쓰지 않도록 변경되었다.

 

build 명령어를 실행했을 때 warning이 발생한다.

npx tailwindcss -i ./src/input.css -o ./dist/output.css --watch

 

 

✔️ purge options이 사라졌다

tailwind CSS 공식 문서를 참고하니 purge를 사용하지 않고 content에서 더 잘 사용하면 된다고 한다.

Content Configuration - Tailwind CSS

 

 

 

✔️ tailwind.config.js 파일에서 purge 없애기

 

원래 이랬던 코드를

module.exports = {
	content: ['./src/**/*.{html,js,jsx,ts,tsx}'],
	purge: {
	 	content: ['./src/**/*.{js,jsx,ts,tsx}', './public/index.html'],
	 	options: {
	 		safelist: ['text-blue-600'],
	 	},
 	},
	theme: {}
}

 

purge를 과감하게 없앴다

module.exports = {
	content: ['./src/**/*.{html,js,jsx,ts,tsx}'],
	theme: {}
}

 

build 명령어를 다시 실행하니 이제는 warning이 발생하지 않는다.

npx tailwindcss -i ./src/input.css -o ./dist/output.css --watch