vue工程部署后需要动态修改地址方法

在很多情况下，vue项目部署完，需要动态修改很多url，比如后台地址，数据地址，服务地址等等。正常vue打包后，代码经过压缩和混淆，无法修改，因此需要将地址文件提出来放在public的static文件加中，作为静态资源，这样打包后，该文件夹里的文件不会改变。

存放地址和调用的方法有两个，分别存储为json文件和js文件

1. 存成json文件，首先在static文件中新建一个json文件，然后存储服务地址。

   {
     "ipLocalhost": "http://192.168.1.245:8090/",
     "ip237": "http://192.168.1.237:8079/",
     "isTitle": true
   }

   在main.js文件中，解析json文件

   import Vue from "vue";
   import axios from "axios";
   
   let startApp = function() {
     axios.get("./static/config/ipConfig.json").then((res) => {
       // 基础地址
       Vue.prototype.ipLocalhost = res.data.ipLocalhost;
       Vue.prototype.ip237 = res.data.ip237;   
       Vue.prototype.isTitle = res.data.isTitle;
   
       Vue.config.productionTip = false;
   
       new Vue({
         store,
         render: (h) => h(App),
        
       }).$mount("#app");
     });
   };
   startApp();

   若是需要在程序中使用地址，首先需要import vue,然后在使用变量：Vue.prototype.ipLocalhost

   import Vue from "vue";
   
    url:Vue.prototype.ipLocalhost + "/01/Scene/Ha_01.json",

    

2. 存成js文件，然后使用window使用，同样现在static文件夹中新建js文件

   window.url = {
     ipLocalhost: "http://192.168.1.245:8090/",
     ip237: "http://192.168.1.237:8079/",
     isTitle: true
   };

   然后在全局的index.html中加载该js文件，

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

   

在程序中使用非常简单，直接用 window.url.ip237  使用即可。