我正在使用TailwindCSS和Laravel Mix。我正在尝试设置PurgeCSS，并且已经读取了我的模板文件（使用WordPress）并清除了不在模板文件中的所有CSS。
但是，作为Tailwind的一部分，我在自己的scss文件中使用@apply，并且我正在应用的那些实用程序也被清除，这使我无法正常运行站点。
我的sass文件位于css/dev中，其中有一个app.scss，然后是其中包含更多文件的目录（base，utilities，custom，{ {1}}。
我的components文件配置如下：
webpack.mix.js如您所见，我尝试设置purgeCss的路径以查看css路径内的内容，但这没有用。
有人知道如何实现这一目标吗？
您要在清除运行之前将scss编译为css ，因此不必只清除main.css（或任何称为输出的内容）中的.scss文件。
您的已编译类名称实际上在模板文件中完全存在 吗？如果它们与模板中的类不是100％匹配，则将非常正确地清除它们。
,问题在于WordPress类未包含在模板文件中，然后被清除。解决方案是切换到使用UnCSS，这使我可以设置URL以供UnCSS访问，并且不会清除这些页面上使用的任何类。我还包括一些标准的WordPress类，这些类在网上找到了清单。
我的最终配置是：
const uncss = require('postcss-uncss');
mix.js('js/dev/app.js','js/build/app.js')
.sass('css/dev/app.scss','css/build')
.options({
processCssUrls: false,postCss: [
tailwindcss('./tailwind.config.js'),...process.env.NODE_ENV === 'production' ? [uncss({
html: [
'./*.php','./template-parts/*.php','https://www.example.com','https://www.example.com/work/','https://www.example.com/work/example-project/','https://www.example.com/contact/','https://www.example.com/blog/','https://www.example.com/blog/laravel-php-framework/',],ignore: [
'.rtl','.home','.blog','.archive','.date','.error404','.logged-in','.admin-bar','.no-customize-support','.custom-background','.wp-custom-logo','.alignnone','.alignright','.alignleft','.wp-caption','.wp-caption-text','.screen-reader-text','.comment-list','.grecaptcha-badge',/^search(-.*)?$/,/^(.*)-template(-.*)?$/,/^(.*)?-?single(-.*)?$/,/^postid-(.*)?$/,/^attachmentid-(.*)?$/,/^attachment(-.*)?$/,/^page(-.*)?$/,/^(post-type-)?archive(-.*)?$/,/^author(-.*)?$/,/^category(-.*)?$/,/^tag(-.*)?$/,/^tax-(.*)?$/,/^term-(.*)?$/,/^(.*)?-?paged(-.*)?$/,'.animate','.animated','.bounce','.fadeInDown','.fadeIn','.fadeInUp','.jackInTheBox',]
})] : [],]
});
我还利用了从清除CSS注释中排除的UnCSS：
/* uncss:ignore start */
my css goes here
/* uncss:ignore end */
我最终在除风顺文件之外的所有自定义sass文件上使用了此文件，因此清除的唯一选择器是顺风实用程序，为我节省了约300 KB。