Vue.js 缩小打包文件体积

1. config\index.js 中将 productionSourceMap: true 改为 productionSourceMap: false 将不生成map文件

2. 使用第三方CDN加载库文件：

• 为了防止将库文件加入打包，先在 build\webpack.base.conf.js 文件中的module.exports = { } 添加 externals 如下：

module.exports = {
  // ...
  externals: {
    // 前面 key 是引用的第三方库名字，后面的 value 是在项目中用的别名?
    'vue': 'Vue',
    'vue-router': 'VueRouter',
    'vuex': 'Vuex',
    'axios': 'axios',
    'element-ui': 'ELEMENT',
    'mapbox-gl': 'mapboxgl'
  }
  // ...
}

• 然后在根目录下的 index.html 中正常引入需要的库文件

    <script src="//cdn.bootcss.com/vue/2.6.10/vue.min.js"></script>
    <script src="//cdn.bootcss.com/vue-router/3.0.6/vue-router.min.js"></script>
    <script src="//cdn.bootcss.com/vuex/3.1.1/vuex.min.js"></script>
    <script src="//cdn.bootcss.com/axios/0.19.0/axios.min.js"></script>
    <script src="//unpkg.com/element-ui/lib/index.js"></script>
    <script src='//api.tiles.mapbox.com/mapbox-gl-js/v1.0.0/mapbox-gl.js'></script>
    <link href='//api.tiles.mapbox.com/mapbox-gl-js/v1.0.0/mapbox-gl.css' rel='stylesheet' />
    <link href="//unpkg.com/element-ui/lib/theme-chalk/index.css" rel="stylesheet" />

3. 路由懒加载

{
    path: '/login',
    name: 'login',
    // 路由懒加载
    component: (resolve) => require(['@/views/Login'], resolve),
    meta: {
        LoginRequire: false
    }
}