在真實的vue項目中，當我們的項目需要上線的時候，需要打包一份靜態代碼給后端放入服務器。由于我們前端本地環境和服務器環境是不一樣的，按照傳統的做法，我們是把后端給的域名和端口寫死在前端，然后再打包代碼發給后端，雖然這樣寫沒什么問題。但現實的情況是，我們的域名或者端口是經常變換的，如果每變一次，前端就該 一次代碼，重新打包一次，那是不是很麻煩？同時這種寫死的做法也不符合我們的編程方式。

如果有一種方法，當我們打包項目后，提供后端一個可修改配置的一個文件，后端愛怎么改就怎么改，和前端沒關系，是不是很嗨皮！

這個配置文件必須要解決兩個問題：
1、配置文件的參數必須是整個前端項目最頂級的，所有頁面所共有的，只要配置參數一變，所有頁面都要跟著變。
2、這個文件在大包的時候，必須不被打包，如果被打包了成靜態文件了，后端人員拿到了也沒辦法改動。

解決方法：
以vue 2.5.2為例，vue項目給我們提供了一個static的文件夾，是專門放置一些并不會被webpack處理的文件，它們會直接復制到最終目錄（dist/static）下。

image.png

第一步：所以我們可以把這個配置文件放在這個目錄里，如：

image.png

配置文件里放著我們需要全局引用的全局變量。

MY_URL = "http://152.19.41.21:8080";
BASE_URL= "http://162.47.43.27:8001"； 

第二步：我們把這個配置文件在index.html里引用。

image.png

第三步：我們項目里之間使用配置文件里的變量。

項目打包后我們發現static里出現我們需要的配置文件：

image.png