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

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

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

vue项目打包优化之-productionSourceMap设置_第1张图片

打包后里面的js文件

**

vue项目打包优化之-productionSourceMap设置_第2张图片

**

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

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

productionSourceMap: 改成false后

vue项目打包优化之-productionSourceMap设置_第3张图片

优化后,打包目录大小

vue项目打包优化之-productionSourceMap设置_第4张图片

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

vue项目打包优化之-productionSourceMap设置_第5张图片

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

总结:

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

你可能感兴趣的:(vue项目打包优化之-productionSourceMap设置)