i have a basic html file (index.html), my project structure is like below :
- index.html
- tailwind.config.js
- postcss.js
- tailwind.css
- dist.css
and here contents for each files
module.exports = { purge: { enabled:true, content:['./*.html', './**/*.html'], layers: ['components'] }, theme: { extend: { fontSize:{ 'small' : '.6rem', // Or with a default line-height as well '3xl': ['2.5rem', { lineHeight: '50px', }], '6xl': ['3.70rem', { lineHeight: '60px', }], }, colors:{ transparent: 'transparent', current: 'currentColor', orange:{ DEFAULT: '#F47521' } }, screens: { 'sm': '640px', 'md': '760px', 'custom' : '980px', 'lg': '1024px', 'xl': '1280px', '2xl': '1536px', '3xl': '1600px', 'xxl' : '1700px' } } }, variants: { textColor: ['responsive', 'hover', 'focus', 'visited'], }, plugins: [ ({addUtilities}) => { const utils = { '.translate-x-half': { transform: 'translateX(50%)', }, }; addUtilities(utils, ['responsive']) } ] }; the postcss file
module.exports = { plugins: { tailwindcss: {}, autoprefixer: {}, } } and my package.json
{ "name": "myproject", "version": "1.0.0", "description": "my theme", "main": "index.js", "scripts": { "test": "echo \"Error: no test specified\" && exit 1", "build": "NODE_ENV=production npx tailwindcss-cli@latest build tailwind.css -o dist.css", "build:css": "postcss tailwind.css -o dist.css" }, "author": "", "license": "ISC", "devDependencies": { "autoprefixer": "^10.2.5", "postcss": "^8.2.8", "tailwindcss": "^2.0.4" }, "dependencies": { "cssnano": "^4.1.10", "postcss-cli": "^8.3.1" } } when building with : npm run build, tailwind build the project but the dist.css size remains 5,7MB
What i'm doing wrong here?
thank you
https://stackoverflow.com/questions/66876272/tailwind-css-not-reduce-file-size-after-purge March 31, 2021 at 02:08AM
没有评论:
发表评论