使用插件 laravel-mix-purgecss 清除未使用的 css

今天进行代码优化，对 app.css 文件进行了压缩，后来在论坛搜索，发现还可以对未使用的 css 进行清除。
于是直接便动手尝试了，发现真的不错。压缩后的 app.css 文件大小是 198k：

使用 laravel-mix-purgecss 插件再次处理过后，文件变成了74k，非常好！

经过简单测试，暂时没发现异常。

安装

// 方法1：使用 yarn 安装
yarn add laravel-mix-purgecss --dev

// 方法2：使用 npm 安装（我使用的是这个）
npm install laravel-mix-purgecss --save-dev

修改配置文件：webpack.mix.js

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(); // <-- 加入此行

进行压缩

npm run production

• 参考文章：零配置为你的 Laravel 项目添加 Purgecss 功能（清除未使用的 CSS 规则，加速页面加载）

本作品采用《CC 协议》，转载必须注明作者和本文链接