webpack打包VUE項目讀取外部配置文件，靈活配置域名

　　做爲一個兼職前端和運維的java程序員，今天我司測試人員提出了一個需求，當後臺服務地址ip地址改變後，webpack打包的VUE項目得更改地址從新打包，太麻煩了，最好能夠讀取外部配置文件的域名，靈活部署。

　　這不是在刁難我胖虎嗎，後來我在網上查資料，發現有解決思路，具體詳細的解決方案沒有，在和前端同事研究後，解決了該問題，現記錄一下，供你們遇到此問題時參考。

　　我司的前端項目我是用nginx部署的，原配置文件prod.env.js代碼以下：

　　

module.exports = {
  NODE_ENV: '"production"',
  ENV_CONFIG: '"prod"',
  BASE_API: '"http://192.168.1.24:8081"'
}

　　在打包成dist文件夾後，確實沒法改變地址，解決思路是在VUE項目的static文件夾下建立config.json文件，裏面配置後臺地址：

"http://192.168.1.21:8081"

　　而後就能夠在prod.env.js中使用這個地址：

var URL = require('../static/config.json');
console.log(URL)
module.exports = {
  NODE_ENV: '"production"',
  ENV_CONFIG: '"prod"',
  BASE_API: "'"+URL+"'"
}

　　經過require引入，這裏踩坑了一次，這個URL讀出來不是字符串，若是在項目中別的地方引用，如：

baseUrl: process.env.BASE_API

　　引發報錯，有兩個：符號，頁面編譯不出來，要把URL變成字符串使用，到此這個需求解決。