PurgeCSS删除第三方库CSS-Laravel Mix / TailwindCSS

问题描述 投票:0回答:1

我在使用自定义CSS以及某些第三方库的现有应用程序中安装了TailwindCSS和PurgeCSS。我将PurgeCSS配置为仅清除单个顺风文件,但是由于某种原因,它从第三方库中删除了CSS选择器,也许我的配置是错误的:

webpack.mix.js

const mix         = require("laravel-mix");
const purgeCss    = require("@fullhuman/postcss-purgecss")
const tailwindCss = require("tailwindcss")

mix.webpackConfig(require("./webpack.parts"));

// Don't want to purge anything under app.scss, it contains custom css &
// current app related stuff
mix.sass("resources/sass/app.scss", "public/css").version();

// I simply want to add tailwind so I can use it in addition to whatever
// css the app currently uses
mix.postCss("resources/sass/tailwind.pcss", "public/css", [
    tailwindCss,
    ...process.env.NODE_ENV === "production" ? [purgeCss(
        {
            content: [
                "./resources/**/*.js",
                "./resources/**/*.blade.php",
            ],

            css: [
                "./public/css/tailwind.css"
            ]
        }
    )] : []
])

尝试将css路径从./public/css/tailwind.css更改为./resources/sass/tailwind.pcss,但没有帮助

laravel webpack laravel-mix postcss tailwind-css
1个回答
0
投票

我无法重现您的错误,此代码对我来说非常有效。

const mix = require('laravel-mix');

const purgecss = require('@fullhuman/postcss-purgecss')({
    content: [
      'resources/**/*.blade.php',
    ],
    defaultExtractor: content => content.match(/[\w-/:]+(?<!:)/g) || []
  })

mix.sass('resources/sass/app.scss', 'public/css').version();


mix.postCss('resources/sass/tailwind.pcss', 'public/css', [
    require('tailwindcss'),
    ...process.env.NODE_ENV === 'production'
    ? [purgecss]
    : []
  ])
© www.soinside.com 2019 - 2024. All rights reserved.