在開發中碰到一個問題，如果公共配置寫在src裡面會被打包，無法做到可讀性可以隨時更改配置，所以只能寫在static資料夾下，那麼就實現一個公共配置檔案吧。

在static資料夾下新增一個配置檔案

const httpUrl = 'http://190.168.1.1:18003/api'

function errorMethod(error, obj) {
  console.log(error)
  if (typeof (error.response) === 'undefined') {
    obj.$message({ message: '網路異常，請稍後再試...', type: 'error' })
    return
  }
  if (error.response.status === 403) {
    obj.$router.push('/')
  } else {
    obj.$message({ message: '網路異常，請稍後再試...', type: 'error' })
  }
}
export default {
  httpUrl,
  errorMethod
}
 

在main.js檔案中新增引用

import config from '../static/config'
vue.prototype.config1 = config

資源搜尋網站大全 https://www.renrenfan.com.cn 廣州VI設計公司https://www.houdianzi.com

就可以在相應的頁面使用了。

this.config1.httpUrl

然鵝。。。上面的這種操作並沒有卵用，只是檔案不打包，但是實際上還是打包進去了，無論怎麼改外面這個包都無效。

既然import引用都會將檔案打包，那麼就採用非import方式引用，也就是最原始的引入js檔案方式。

1、在static資料夾下建立檔案common.js

var common = {
  httpUrl: 'http://192.168.1.1:18003/project',
  pollTime: 10000,
  errorMethod: function(error, obj) {
    console.log(error)
    if (typeof (error.response) === 'undefined') {
      obj.$message({ message: '網路異常，請稍後再試...', type: 'error' })
      return
    }
    if (error.response.status === 403) {
      obj.$router.push('/')
    } else {
      obj.$message({ message: '網路異常，請稍後再試...', type: 'error' })
    }
  }
}
 

2、在你的vue-cli根目錄的index.html檔案中新增你的這個js檔案引用。

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

3、就按照這種引入方式來呼叫即可拿到值。

common.httpUrl