tailwindcss
purgecss 사용방법( 사용하지 않는 css 제거 라이브러리 )
땀모
2019. 8. 20. 06:30
1. npm으로 설치
1 | npm install @fullhuman/postcss-purgecss | cs |
2. 사용할 모듈 추가, 페이지도 추가
1 2 3 4 5 6 7 8 9 10 11 12 13 | module.exports = { plugins: [ require('tailwindcss'), require('autoprefixer'), require('@fullhuman/postcss-purgecss')({ content : [ './src/**/*.vue', './public/index.html', ] }) ] } | cs |
3. 정규표현식 넣어주기
1 2 3 4 5 6 7 8 9 10 11 12 13 14 | module.exports = { plugins: [ require('tailwindcss'), require('autoprefixer'), require('@fullhuman/postcss-purgecss')({ content : [ './src/**/*.vue', './public/index.html', ], defaultExtractor: content => content.match(/[A-Za-z0-9_:/]+/g) || [] }) ] } | cs |
4. 빌드
1 | npm run build | cs |
5. tailwind.css 에 사용하지 않은 css가 제거 된다.
파일 용량도 줄겠지?