laravel-mix purifyCss选项不起作用

时间:2018-02-27 16:25:40

标签: laravel laravel-mix purifycss

我希望使用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永远不会被删除。

2 个答案:

答案 0 :(得分:0)

问题已经解决了。

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

答案 1 :(得分:0)

此问题中的答案不只于我们

  1. 实际上,类名存在问题。在purifycss不变的情况下,它们应该匹配/[a-z]+/
  2. 该版本对run dev可能适用,但是在run prod时失败,这是由于第三方存储库(第二级依赖项)中的问题会在您净化缩小的CSS文件时出现,例如bootstrap 4。您可以在PR中找到详细的说明,并跟踪issue

现在您可以使用npm install git://github.com/alex7r/css.git#master(是的,我更喜欢npm)