在Vue中通过添加配置文件维护全局变量

必要性分析

项目中很多时候需要使用到全局变量。如果不通过配置文件进行配置，则需要在每次使用时进行获取，如果某个变量发生变化，需要逐个文件进行查找替换，有可能会出现遗漏，所以使用配置文件配置非常有必要！

实现过程

我首先想到的是需要搭建一个服务，不然js如何取读取文件呢？启一个读配置的服务，但我又要怎么将配置赋值给vuex（接口公共的IP和端口都放到这里的）中的某个变量呢？是的变量替换，但是变量替换又涉及打包后代码变量已经不能识别问题...

a few minutes later，我想到可以用js充当配置文件，这样就可以直接获取配置，那么剩下的问题就是如何避免该文件被打包。正好当时又在segmentfault中看到有人说/static/目录不会被webpack打包，那么思路就清晰了：在/static/目录下**新增一个config.js作为配置公共参数的文件，然后在项目中引用。

具体过程

1. 在Vue项目中的/static/目录下新增文件config.js，用以存储一些可配置的参数。
   
   
2. 在index.html中引用该js,<script src="/static/config.js"></script>
3. 在eslintrc.js中设置全局变量，否则在使用时eslint会报错： no-undef未定义变量。
   

1. 这里设置的全局变量可以赋值给vuex中的某个变量声明，这样更容易理解，别人也就不会疑惑config从哪里来。

2. 通过上面的配置， 配置文件中的config.test就已经能在项目中使用了。

3. 打包后config.js文件在/dist/static/目录下，如果你在其中配置了接口的IP，那么当更换了服务器，则只需修改/dist/static/目录下的config.js就可以正常运行项目了。