如何在 Laravel Mix 中使用 PurifyCSS？

Question

我想在Laravel中使用PurifyCSS，但我无法让它工作。

堆

Laravel：5.5.4

NPM：6.0.0

Node.js：8.10

代码

mix.styles([
    'resources/assets/css/panel/a.css',
    'resources/assets/css/panel/b.css',
    'resources/assets/css/panel/c.css',
    'resources/assets/css/panel/d.css',
], 'public/css/panel.css').options({
    purifyCss: {
        purifyOptions: {
            info: true,
            rejected: true,
            minify: true
        },
        paths: ['resources/views/admin-layout.blade.php'],
        verbose: true
    },
});

我在互联网上搜索，但找不到任何东西。我想从所有 Blade 页面中删除未使用的 CSS。即使在此链接上，也没有人给出正确答案。即使 PurifyCSS 是第一个，它也不起作用。

谢谢您的帮助。

Answer 1

首先安装 PurgeCSS。

npm install laravel-mix-purgecss --save-dev

声明mix变量并设置选项相对简单。

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

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

在此代码中，purgeCss()将从编译的 CSS 文件中删除未使用的 CSS。默认情况下，它将扫描您的 resources/views 目录中的 Blade 模板，以及您的 resources/js 目录中的 JavaScript 或 Vue 组件。