laravel-mix purifyCss 选项不起作用答案

【问题标题】：laravel-mix purifyCss option not workinglaravel-mix purifyCss 选项不起作用
【发布时间】：2018-02-27 16:25:40
【问题描述】：

我希望使用 laravel-mix 的 purifyCss。该功能在全新安装上运行良好，但是当我尝试从旧版本的 laravel-mix 升级时，没有任何反应，也没有显示错误。

这是当前的 package.json 文件

{
  "private": true,
  "scripts": {
    "dev": "npm run development",
    "development": "cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js",
    "watch": "cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --watch --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js",
    "watch-poll": "npm run watch -- --watch-poll",
    "hot": "cross-env NODE_ENV=development node_modules/webpack-dev-server/bin/webpack-dev-server.js --inline --hot --config=node_modules/laravel-mix/setup/webpack.config.js",
    "prod": "npm run production",
    "production": "cross-env NODE_ENV=production node_modules/webpack/bin/webpack.js --no-progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js"
  },
  "devDependencies": {
    "cross-env": "^5.1",
    "laravel-mix": "^2.0",
    "popper.js": "^1.13.0",
    "purify-css": "^1.2.6",
    "purifycss-webpack": "^0.7.0"
  },
  "dependencies": {
    "bootstrap": "^4.0.0",
    "font-awesome": "^4.7.0",
    "jquery": "^3.3.1",
    "normalize.css": "^8.0.0",
    "velocity-animate": "^2.0.1"
  }
}

这是我的webpack.mix.js

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

mix.options({
    purifyCss: true
});

//default path
mix.setPublicPath('website');

//index
mix.sass('resources/assets/sass/index/index-desktop.scss', 'css/index/index-desktop.min.css');

这是一个测试刀片文件

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" lang="{{ session('user.language_code') }}">
<head>
    <title></title>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link href="https://fonts.googleapis.com/css?family=Caudex" rel="stylesheet">
    <link rel="stylesheet" href="{{ asset('css/index/index-desktop.min.css') }}">

</head>
<body>

</body>
</html>

我也在使用yarn，当我尝试yarn run production 时，css 永远不会被删除。

【问题讨论】：

你是从哪个版本升级的，升级到哪个版本？
从 laravel-mix：^1.0 到 2.0

标签： laravel laravel-mix purifycss

【解决方案1】：

问题已解决。

对于遇到相同问题的任何人，请检查您的班级/ID，并确保他们没有任何数字。

【讨论】：

这适用于您的生产模式吗？是不是太脱皮了？

【解决方案2】：

这个问题的答案不止被接受：

确实存在类名问题。在 purifycss 没有变化的情况下，它们应该匹配 /[a-z]+/
构建可能适用于 run dev，但在 run prod 时会失败，因为在您净化缩小的 css 文件时会出现第 3 方存储库（第二级依赖项）的问题，例如 bootstrap 4例子。您可以在PR找到详细解释，并跟踪issue。

现在你可以使用npm install git://github.com/alex7r/css.git#master（是的，我更喜欢 npm）

【讨论】：