赞
踩
记录一个vue项目打包时的大坑,因为需要在index.html里加入一些自定义的东西,结果打包后相关属性都没有双引号,最后各种百度谷歌终于解决了,哈哈(我用的vue-cli4)
vue-cli4配置和低于4的配置有些不同,4只用一个vue.config.js基本就行了
1.百度上搜索的有些人这么解决的(vue-cli4以下)
找到webpack.prod.conf.js文件,加上removeAttributeQuotes: false;
new HtmlWebpackPlugin({ filename: process.env.NODE_ENV === 'testing' ? 'index.html' : config.build.index, template: 'index.html', inject: true, minify: { removeComments: true, collapseWhitespace: true, // true会缺少引号 removeAttributeQuotes: false // more options: // https://github.com/kangax/html-minifier#options-quick-reference }, // 解决打包公用代码没有添加进去 chunks: ['manifest', 'vendor', 'app'], // necessary to consistently work with multiple chunks via CommonsChunkPlugin chunksSortMode: 'dependency' }),
2.百度上搜索的有些人这么解决的(vue-cli4)
在vue.config.js参照下面这么修改(这个vue.config.js应该知道怎么弄的吧)
chainWebpack: config => { config.plugins.delete('preload-search') config .plugin('html-search') .tap(args => { return [ { preload: false, title: packageJson.description, template: __dirname + '/public/search.html', minify: { removeAttributeQuotes: false } } ] }) },
或者
chainWebpack: config => {
config.plugins.delete('preload-search')
config
.plugin('html-search')
.tap(args => {
args[0].minify.removeAttributeQuotes = false
return args
})
}
反正我怎么试都不行,不知道他们是怎么弄的,报"html-search"有问题
3.我是这么修改的(vue-cli4)
经过一番查看,发现人家vue-cli4以下的都没有见过这个"html-search"这个插件,大家都用的"html"就行了,不知道vue-cli4可以不,结果试了试居然可以,哈哈
chainWebpack: config => {
config.resolve.alias
.set('@', resolve('src')) // key,value自行定义,比如.set('@@', resolve('src/components'))
.set('@c', resolve('src/components'));
config.plugins.delete('prefetch');
config.plugins.delete('preload-search');
//解决打包head里标签属性没有双引号
config.plugin('html')
.tap(args => {
args[0].minify.removeAttributeQuotes = false;
return args;
});
},
反正思路就是这样,removeAttributeQuotes = false;才是关键!
最后附上小站地址 :毒蘑菇配色
Copyright © 2003-2013 www.wpsshop.cn 版权所有,并保留所有权利。