今天遇到个很蛋疼的问题,就是领导要求替换网站的logo,本想直接在打包文件里替换图片就ok了,结果翻看打包文件的时候傻眼了,竟然缺图!!!
项目中的图片是22个
打包后就变成12个了
这样想直接更改项目的图片就很麻烦,还需要重新找到之前版本的代码,再重新打包。
经页面确认,原来是小图片打包后自动变为base64编码的格式了。那么如何不让图片自动变为base64编码呢?
新建一个vue.config.js的文件(在根目录),然后进行如下配置,就可以控制图片转义规则:
vue.config.js位置
vue.config.js文件:
module.exports = {
chainWebpack: config => {
config.module
.rule('images')
.use('url-loader')
.loader('url-loader')
.tap(options => Object.assign(options, { limit: 20000 }))
}
};
注意:修改里面的limit的数值即可修改图片进行base64转换文件的大小限制
网友评论