Vue项目在不rebuild情况下更新接口URL（不限于URL）

方案1：public目录下创建js文件，配置webpack-externals属性（优先推荐）

externals配置提供了从输出的bundle中排除依赖的方法，防止将某些import的包打包到bundle中。我们可以利用这个特性将接口配置抽离为某个js文件中放置在public文件夹下，然后在项目中直接导入externals申明的配置依赖，直接使用即可。

例子(使用vui-design-pro作为项目演示)

1.首先先在public文件夹中创建一个config.js文件，这边只写入一些url的配置
2.以vue-cli为例，打开vue.config.js文件，更新webpack配置项，添加externals。
3.需要注意的是externals里申明的扩展依赖，需要在html模板中手动引入。

4.在项目内使用（直接import导入使用）

5.将项目打包放入服务器中进行测试（这边使用express-generator）直接开启一个资源服务器，将打包后的dist目录放入服务目录的public中，访问服务地址



6.现在我们直接手动更改服务器的config.js文件，将production的url和development的url更换，刷新页面

方案2：public目录下创建json文件，每次启动应用请求json

1.public目录下创建json文件
2.在main.js项目入口请求json文件，适配基础路径

3.执行打包，将打包后的资源放入服务地址的public目录下，访问服务资源


4.后续操作与方案一致

对比

1. 两者最终实现的效果和思路是一致的。
2. 推荐优先使用方案1。首先js文件在ide编辑上更加舒适，将配置对象直接写成以js的形式书写；其次，这样做有利于进一步的配置分离，直接通过import语法使用，而不用书写额外的发送请求代码。