使用externals配置,在VUE 工程中引入外部js文件,减少打包时间

以VUE项目中引入echarts文件为例：

第一步在VUE项目中找到index.html文件

   引入 ：

<script src="https://cdnjs.cloudflare.com/ajax/libs/echarts/4.2.1/echarts.js"></script>

第二步 在项目找到 build > webpack.base.conf.js

   module.exports = {
          externals: {
             'echarts': 'echarts' （此处为cdn引入的js文件名）
         }
    }

第三步 在需要用到的文件中引入

      import echarts  from  echarts

注:vue-cli3版本中在 vue.config.js 文件中配置 externals(需重启)

module.exports = {
  devServer: {
    port: 3200// 端口号配置
  },
  configureWebpack: {
    externals: {
      'TencentCaptcha: 'TencentCaptcha'
    }
  }
}