Js压缩在webpack中默认内置了uglifyjs-webpack-plugin ,在打包的时候会自动压缩,不需要专门配置
css压缩
使用 optimize-css-assets-webpack-plugin 插件和预处理器 cssnano
npm i cssnano -D
npm i optimize-css-assets-webpack-plugin -D
Html压缩
修改html-webpack-plugin ,设置压缩参数
安装 npm i html-webpack-plugin -D
每一个页面需要一个新的HtmlWebpackPlugin
plugins:[
new MiniCssExtractPlugin({
filename:\'[name]_[contenthash:8].css\'
}),
new OptimizeCssAssetsPlugin({
assetNameRegExp:/\.css$/g,
cssProcessor:require(\'cssnano\')
}),
new HtmlWebpackPlugin({
template:path.join(__dirname,"src/index.html"),
filename:\'index.html\',//压缩完文件名
chunks:[\'s\'], //引入js文件
inject:true,
minify:{
html5:true,
collapseWhitespace:true,
preserveLineBreaks:false,
minifyCSS:true,
minifyJS:true,
removeComments:false
}
})
]