Блог

Я включаю Tailwind CSS в свой проект, используя PostCSS, и встроенная реализация очистки Tailwind отлично работает для основной библиотеки ( style.pcss ниже). Однако я также включаю его @tailwind/typography в качестве плагина, и его селекторы не удаляются.

 // postcss.config.js

const cssnano = require('cssnano')

module.exports = {
  plugins: [
    require('postcss-import'),
    require('tailwindcss'), 
    process.env.NODE_ENV === 'production' ? require('autoprefixer') : null,
    process.env.NODE_ENV === 'production' ? cssnano({ preset: 'default' }) : null
  ]
}
  

 // tailwind.config.js

module.exports = {
  plugins: [
    require('@tailwindcss/typography')
  ],
  purge: [
    './build/*.html',
    './build/**/*.html'
  ],
}
  

 // style.pcss

@tailwind base;
@tailwind components;
@tailwind utilities; 
  

Я столкнулся с тем же самым!

Об этом есть заметка на typography README:

https://github.com/tailwindlabs/tailwindcss-typography#purging-unused-styles

…и более подробная информация в документации tailwindscss:

https://tailwindcss.com/docs/controlling-file-size#removing-all-unused-styles

Вот как, вероятно, должен выглядеть ваш tailwind.config.js :

 module.exports = {
  plugins: [
    require('@tailwindcss/typography')
  ],
  purge: {
    enabled: true,
    mode: 'all',
    content: [
      './build/*.html',
      './build/**/*.html'
    ],
    options: {
      whitelist: []
    }
  },
}