webpack设置了压缩,html也会被压缩,什么参数能排除html被压缩

webpack设置了压缩,html也会被压缩,什么参数能排除html被压缩,第1张

这里说明了,如果单纯使用html-webpack-plugin插件来处理html,那么在此插件下设置minify为false,就不会压缩html文件;但是如果使用了loader与html-webpack-plugin一起处理html,那么html的压缩还受loader的影响。

从你的描述来看,我估计是受了loader的影响了。

1. 安装: html-webpack-plugin 插件完成打包

2. 命令:npm install html-webpack-plugin –save-dev

3. 配置:

引入:const HtmlWebpackPlugin = require('html-webpack-plugin');

module.exports = {

entry: 'index.js',

output: {

path: __dirname + '/dist',

filename: 'index_bundle.js'

},

plugins: [

new HtmlWebpackPlugin({

title: 'My App',(生成的页面标题)

filename: 'assets/admin.html',(生成的文件名)

template: 'src/assets/test.html',(原来的index.html)

minify: {

collapseWhitespace: true,

removeComments: true,

removeRedundantAttributes: true,

removeScriptTypeAttributes: true,

removeStyleLinkTypeAttributes: true,

useShortDoctype: true

}

})

]

}(BY三人行慕课)

webpack内置插件 UglifyJsPlugin

使用 webpack --optimize-minimize 启动webpack,可以注入默认配置的UglifyJSPlugin

第三方插件 css-loader.minimize

第三方插件 uglify-webpack-plugin

第三方插件 html-webpack-plugin

第三方插件 image-webpack-loader

也可以将图片上传到 tinypng 或者 智图 这类的在线压缩图片平台,就可以对图片进行压缩


欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/zaji/6169264.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-03-17
下一篇 2023-03-17

发表评论

登录后才能评论

评论列表(0条)

保存