美文网首页
vue项目打包优化之-productionSourceMap设置

vue项目打包优化之-productionSourceMap设置

作者: 煎鸡蛋的梦_ | 来源:发表于2020-09-29 15:05 被阅读0次

原链接:https://www.cnblogs.com/lml-lml/p/12770980.html

这个是优化之前项目打包后dist目录文件大小,约为20.6MB

打包后里面的js文件

**

**

打包后每个js文件都有一个map文件

map文件的作用:项目打包后,代码都是经过压缩加密的,如果运行时报错,输出的错误信息无法准确得知是哪里的代码报错。 有了map就可以像未加密的代码一样,准确的输出是哪一行哪一列有错。

productionSourceMap: 改成false后

优化后,打包目录大小

优化后打包目录里的前端文件

productionSourceMap: 改成false后 所有打包生成的map文件都没有了,打包包体积大小直接从20.6MB变成5.05MB,一下子减少15MB!!!奥利给

总结:

在设置了vue.config.js之后,就不会生成map文件,map文件的作用在于:项目打包后,代码都是经过压缩加密的,如果运行时报错,输出的错误信息无法准确得知是哪里的代码报错。也就是说map文件相当于是查看源码的一个东西。如果不需要定位问题,并且不想被看到源码,就把productionSourceMap 置为false,既可以减少包大小,也可以加密源码。

相关文章

  • vue项目打包优化之-productionSourceMap设置

    原链接:https://www.cnblogs.com/lml-lml/p/12770980.html 这个是优化...

  • vue项目打包 — productionSourceMap设置

    今天甲方说打包后的文件要去掉 js.map 文件,好吧。 本来map文件的作用在于:项目打包后,代码都是经过压缩加...

  • vue项目优化

    vue 项目优化 项目打包体积优化 通常vue项目通过webpack打包后,会出现vendor包的体积过大的情况,...

  • vue 打包移除 map

    在vue.config.js中加入 productionSourceMap:false, 然后打包npm run...

  • vue项目打包上线

    一、设置项目打包输出的目录,修改vue.config.js中的outputDir, 二、打包项目(npm run ...

  • Vue 网站首页加载优化

    Vue 网站首页加载优化 本篇主要讲解 Vue项目打包后 vendor.js 文件很大 如何对它进行优化 以及开启...

  • 博客网站首页加载优化

    Vue 网站首页加载优化 本篇主要讲解 Vue项目打包后 vendor.js 文件很大 如何对它进行优化 以及开启...

  • Vue优化项目加载速度

    1.在编译时不生成.map文件在vue.config.js离设置productionSourceMap为false...

  • vue项目打包优化

    前言:当我们对项目进行打包时,打包后我们可能会发现打的包非常大,我们可以使用路由懒加载的方式,若包仍过大,我们可以...

  • Vue 项目打包优化

    一、路由懒加载:分割代码块 二、webpack 打包生成 .gz 文件(gzip压缩) 三、CDN 四、去掉所有的...

网友评论

      本文标题:vue项目打包优化之-productionSourceMap设置

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