项目本地开发完成后,我们就需要将代码 部署到线上服务器。再次之前,就需要把这些零散的文件打包成一个css和js文件,以减少http的请求数,避免额外的性能损耗。
vue-cli提供了代码编译、合并、压缩的脚本build/build.js,运行npm run build后,得到文件如下所示
build.js将组件中的css变异合并成一个app.[hash].css文件。
js则在合并后又拆分成了3个文件,app.[hash].js包含了所有components中的js代码,vendor.[hash].js包含了所有引用的node_modules中的代码,而mainfest.[hash].js则包含了webpack运行环境,以及模块化 所需的js代码。
这样拆分的好处是,每块组件修改重新编译后,不影响其他未修改的js文件的hash值,这样能够最大限度的使用缓存,减少htttp请求。