webpack坑

43 阅读1分钟

CleanPlugin is not a constructor

原因
'clean-webpack-plugin’插件的引入方式变了 要解构引入

{CleanPlugin} = require('clean-webpack-plugin')

Error: webpack.optimize.UglifyJsPlugin has been removed, please use config.optimization.minimize instead.

原因:webpack在最新版本中删除了webpack下optimize内置的方法,需要我们改用其他插件来使用。

cnpm i uglifyjs-webpack-plugin -D

在webpack.config中

optimization: {
        minimizer: [
            // 自定义js优化配置,将会覆盖默认配置
      new UglifyJsPlugin({
        exclude: /\.min\.js$/, // 过滤掉以".min.js"结尾的文件,我们认为这个后缀本身就是已经压缩好的代码,没必要进行二次压缩
        cache: true,
        parallel: true, // 开启并行压缩,充分利用cpu
        sourceMap: false,
        extractComments: false, // 移除注释
        uglifyOptions: {
          compress: {
            unused: true,
            warnings: false,
            drop_debugger: true
          },
          output: {
            comments: false
          }
        }
      }),
        ]
      },

Cannot read property ‘lessLoader’ of undefined

less和less-loader换版本试试

warnings is not a supported option

原因:uglifyOptions的结构变了
在这里插入图片描述

Error: html-webpack-plugin could not minify the generated output

试试参数 minify: false,或者

minify: { //压缩HTML文件
                removeComments: true, //移除HTML中的注释
                collapseWhitespace: false //删除空白符与换行符
            },

抽离css

4以下用 extract-text-webpack-plugin
4用mini-css-extract-plugin

compilation.getAssets is not a function

原因 webpack和

转化图片base64出现default前缀

url-loader options加上esModule: false,即可