如何通过vue-cli优化配置来有效减小项目文件体积？

本文共计395个文字，预计阅读时间需要2分钟。

1. 使用npm安装已集成Vue-CLI的项目，项目地址：[https://gitee.com/ligeyihayou/Vue-Cli-zyn.git](https://gitee.com/ligeyihayou/Vue-Cli-zyn.git)（包含vue-router、vuex、vue-lazyload、better-scroll、axios，支持同一网络手机访问，读取本机IP地址，http拦截器）。

2. 运行项目：`npm run serve`

1. 通过npm 安装 vue-cli 已经集成完毕 gitee.com/ligeyihayou/Vue-Cli-zyn.git (vue-router, vuex, vue-lazyload, better-scroll, axios, 允许同一网络手机访问, 读取本机IP地址, webpack.github.io/docs/library-and-externals.html 1.1 修改build下，webpack.base.conf.js // 配置常用的库文件，不会由webpack处理，但是会带来额外的cdm的http请求数量增加，做好权衡 module.exports = { externals: { 'vue': 'Vue', 'vuex': 'Vuex', 'vue-router': 'VueRouter' } } 1.2 修改index.html 文件 说明：将外部的不被webpack管理的文件，使用cdn的文件已script的方式引入 eg: 1.3 清除router/index.js 中的Vue.use(Vue-router) stroe/index.js 中的 Vue.use(Vuex) 3. 我目前使用的是nginx服务器(启用服务器的gzip压缩)，可以大大加快访问速度 http{ gzipon; gzip_min_length1k; gzip_buffers416k; #gzip_http_version1.1; gzip_comp_level2;#压缩级别#要压缩的mine类型 gzip_typestext/plainapplication/javascriptapplication/x-javascripttext/javascripttext/cssapplication/xmlapplication/xml+rssimage/jpegimage/gifimage/pngimage/svg+xml; gzip_varyoff; gzip_proxiedexpiredno-cacheno-storeprivateauth; gzip_disable"MSIE[1-6]\.";#IE6不支持gzip } nginx -t 查看nginx的配置文件是否正确 nginx –s reload //重启