webpack -- 代码压缩

概述一、代码压缩坑 正常情况下，如果我们配置生成环境，webpack会自动帮js压缩，必须配置--mode=production scripts: { "build": "webpack --mode-production"} 但是如果我们要把css也压缩的话，问题就来了，css压缩 npm install optimize-css-assets-webpack-plugin --save- 一、代码压缩坑

正常情况下，如果我们配置生成环境，webpack会自动帮Js压缩，必须配置--mode=production

scripts: {    "build": "webpack --mode-production"}

但是如果我们要把CSS也压缩的话，问题就来了，CSS压缩

npm install optimize-css-assets-webpack-plugin --save-devnpm install cssnano --save-dev

调用

const OptimizeCSSWebpackPlugin = require('optimize-css-assets-webpack-plugin')const cssnano = require('cssnano')plugins: [    new OptimizeCSSWebpackPlugin({        test: /\.CSS$/g,cssprocessor: cssnano,cssprocessorOptions: {discardComments: {removeAll: true;}},// 这一句似乎是移除所有注释        canPrint: true    })],optimization: {    minimizer: [new OptimizeCSSWebpackPlugin({})]}

用了CSS压缩后，我们发现，Js不压缩了，这是需要使用插件uglifyJs-webpack-plugin

npm install uglifyJs-webpack-plugin --save-dev

调用

const UglifyJsWebpackPlugin = require('uglifyJs-webpack-plugin')plugins: [    new UglifyJsWebpackPlugin()]

注意，这样虽然能行，但是看网上，好像这个跟CSS一样，也要在optimization的minimizer数组里面

总结

以上是内存溢出为你收集整理的webpack -- 代码压缩全部内容，希望文章能够帮你解决webpack -- 代码压缩所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。