vue-cli3+项目,按环境引入cdn资源

因为项目太大了,很多很大的依赖包,为了做优化,把大的包通过cdn的方式引入,但是正式服希望引入min.js,开发服希望直接引入非min的js,因为min版把一些报错和警告都去掉,不方便调试

需求:
①.期望使用min.js资源的服使用min.js的cdn资源
②.期望使用非min.js资源的服使用非min.js的cdn资源

一、查找.通过"webpack-bundle-analyzer"插件,查到到较大的依赖,就找对应的CDN资源引入

//vue.config.js下
//下载依赖 npm i -D webpack-bundle-analyzer
const openBundleAnalyzer = false;//是否打开bundle分析


configureWebpack:config=>{
   
	    if (openBundleAnalyzer) {
   
      const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin;
      plugins.push(new BundleAnalyzerPlugin(),)
    }
}

二、告诉webpack,哪些依赖我希望用cdn引入的方式处理

//vue.config.js下

//另外创建了一个维护cdn
const cdnConfig = require('./config/cdn.js');

  configureWebpack: config => {
   

    const externals = {
   };
    Object.keys(cdnConfig).forEach(key => {
   
      externals[key] = cdnConfig[key].name
    });