1、问题
在优化vue-cli项目时，为了减少文件体积，采用cdn的方式加载了第三方的依赖。
在vue.config.js中，在发布模式下配置externals节点：

module.exports = {
 chainWebpack: config =>{
    //  使用chainWebpack节点修改webpack默认的配置，当处于生产环境，获取默认的打包入口（main.js），清除，再通过add方法添加指定的入口文件
    config.when(process.env.NODE_ENV ==='production', config =>{
        config.entry('app').clear().add('./src/main-prod.js')
        // 在externals节点中指定不被合并到打包后生成的文件的依赖，之后使用import导入的指定依赖的js文件就不会被合并到打包生成的文件中了
        config.set('externals', {
            vue: 'Vue',
           'vue-router': 'VueRouter',
           axios: 'axios',
           lodash: '_',
           echarts: 'echarts',
           nprogress: 'NProgress',
           'vue-quill-editor': 'VueQuillEditor'
           })
    })
    // 当处于开发环境，获取默认的打包入口（main.js），清除，再通过add方法添加指定的入口文件
    config.when(process.env.NODE_ENV ==='development', config =>{
        config.entry('app').clear().add('./src/main-dev.js')
    })
 }
}

在public/index.html 的head 标签中：

<!-- nprogress 的样式表文件 -->
    <link rel="stylesheet" href="https://cdn.staticfile.org/nprogress/0.2.0/nprogress.min.css" />
    <!-- 富文本编辑器 的样式表文件 -->
    <link rel="stylesheet" href="https://cdn.staticfile.org/quill/1.3.4/quill.core.min.css" />
    <link rel="stylesheet" href="https://cdn.staticfile.org/quill/1.3.4/quill.snow.min.css" />
    <link rel="stylesheet" href="https://cdn.staticfile.org/quill/1.3.4/quill.bubble.min.css" />

    <script src="https://cdn.staticfile.org/vue/2.5.22/vue.min.js"></script>
    <script src="https://cdn.staticfile.org/vue-router/3.0.1/vue-router.min.js"></script>
    <script src="https://cdn.staticfile.org/axios/0.18.0/axios.min.js"></script>
    <script src="https://cdn.staticfile.org/lodash.js/4.17.11/lodash.min.js"></script>
    <script src="https://cdn.staticfile.org/echarts/4.1.0/echarts.min.js"></script>
    <script src="https://cdn.staticfile.org/nprogress/0.2.0/nprogress.min.js"></script>
    <!-- 富文本编辑器的 js 文件 -->
    <script src="https://cdn.staticfile.org/quill/1.3.4/quill.min.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/vue-quill-editor@3.0.4/dist/vue-quill-editor.js"></script>

在开发环境下打包项目，报错 ：Uncaught TypeError: Cannot redefine property: $router

2、原因
重复引入了vue-router。在vue-cli创建工程时，默认安装了 vue-router，再次引入CDN资源导致重复引入就会报错。
3、解决办法
方法1：

卸载 npm uninstall vue-router --dev-save，删除 node_modules文件夹，删除package.json中的vue-router依赖，重新执行 npm install。

方法2：（在实际项目中的处理方式）

在开发模式下不引入CDN资源，发布模式下引入CDN资源。
在vue.config.js中,如下配置：

module.exports = {
 chainWebpack: config =>{
    //  使用chainWebpack节点修改webpack默认的配置，当处于生产环境，获取默认的打包入口（main.js），清除，再通过add方法添加指定的入口文件
    config.when(process.env.NODE_ENV ==='production', config =>{
        config.entry('app').clear().add('./src/main-prod.js')
        // 在externals节点中指定不被合并到打包后生成的文件的依赖，之后使用import导入的指定依赖的js文件就不会被合并到打包生成的文件中了
        config.set('externals', {
            vue: 'Vue',
           'vue-router': 'VueRouter',
           axios: 'axios',
           lodash: '_',
           echarts: 'echarts',
           nprogress: 'NProgress',
           'vue-quill-editor': 'VueQuillEditor'
           })
        //  发布模式引入cdn资源
        config.plugin('html').tap(args => {
            args[0].isProd = true
            return args
        })
        
    })
    // 当处于开发环境，获取默认的打包入口（main.js），清除，再通过add方法添加指定的入口文件
    config.when(process.env.NODE_ENV ==='development', config =>{
        config.entry('app').clear().add('./src/main-dev.js')
        // 开发模式不引入cdn资源
        config.plugin('html').tap(args => {
            args[0].isProd = false
            return args
        })
    })
 }
}

在public/index.html 的head 标签中：

<!-- 先判断是否是发布模式，发布模式引入cdn资源 -->
  <% if(htmlWebpackPlugin.options.isProd){ %>
    <!-- nprogress 的样式表文件 -->
    <link rel="stylesheet" href="https://cdn.staticfile.org/nprogress/0.2.0/nprogress.min.css" />
    <!-- 富文本编辑器 的样式表文件 -->
    <link rel="stylesheet" href="https://cdn.staticfile.org/quill/1.3.4/quill.core.min.css" />
    <link rel="stylesheet" href="https://cdn.staticfile.org/quill/1.3.4/quill.snow.min.css" />
    <link rel="stylesheet" href="https://cdn.staticfile.org/quill/1.3.4/quill.bubble.min.css" />

    <script src="https://cdn.staticfile.org/vue/2.5.22/vue.min.js"></script>
    <script src="https://cdn.staticfile.org/vue-router/3.0.1/vue-router.min.js"></script>
    <script src="https://cdn.staticfile.org/axios/0.18.0/axios.min.js"></script>
    <script src="https://cdn.staticfile.org/lodash.js/4.17.11/lodash.min.js"></script>
    <script src="https://cdn.staticfile.org/echarts/4.1.0/echarts.min.js"></script>
    <script src="https://cdn.staticfile.org/nprogress/0.2.0/nprogress.min.js"></script>
    <!-- 富文本编辑器的 js 文件 -->
    <script src="https://cdn.staticfile.org/quill/1.3.4/quill.min.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/vue-quill-editor@3.0.4/dist/vue-quill-editor.js"></script>
  <% } %>

参考链接：https://blog.csdn.net/vampire10086/article/details/107906904