vue项目打包后 希望可以修改配置（接口地址，系统名称等）

需求：

项目打包发布，之后可能存在接口域名更换，项目名称修改等情况，就需要开发人员重新修改代码，重新发布，比较费时费力。希望可以将这些配置在一个文件中，如需更换，运维可直接打开配置文件，更改保存即生效。

实现：

【一】：Vue项目下找到public文件夹（没有public的找到static文件夹），在该文件夹下建 config.js 文件（文件名随意）

 

写入代码：（下面都以static的为例）

window.g = {
  localBaseUrl: 'http://xx.249.3.124:19088/sjgj', // 本项目地址
  middleBaseUrl: 'http://xx.249.3.124:19013', // 中台地址
};

【二】：在 项目 index.html 文件中引入该文件

<script src="./static/config.js"></script>

【三】：页面中使用

// 例如
const baseURL = process.env.NODE_ENV === 'development' ? 'http://xxx.xxx.xxx.xxx:10087' : window.g.localBaseUrl
const authURL = process.env.NODE_ENV === 'development' ? 'http://xxx.xxx.xxx.xxx:9833' : window.g.middleBaseUrl

总结：

以上配置后，在我们项目打包后可以看到多了个 config.js 文件，如需修改相关配置，运维人员可自行更改。如配置更改后不生效，可清除浏览器缓存后再查看。