美文网首页
vue-cli3打包后小图片自动变成base64格式

vue-cli3打包后小图片自动变成base64格式

作者: 一名有马甲线的程序媛 | 来源:发表于2019-11-27 18:00 被阅读0次

    今天遇到个很蛋疼的问题,就是领导要求替换网站的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转换文件的大小限制

    点击查看原文

    相关文章

      网友评论

          本文标题:vue-cli3打包后小图片自动变成base64格式

          本文链接:https://www.haomeiwen.com/subject/ebcmwctx.html