1.設定不同的介面位址
先找到以下檔案
/config/dev.env.js
/config/prod.env.js
可以看到dev.env.js裡面內容如下
這是生產環境的引數配置,然後我們可以再上面檔案加入一行**,如下:
這就是本地測試環境請求後台介面的網域名稱
然後找到prod.env.js檔案,如下:
我們加入一行**,如下:
這是我們上傳伺服器以後,請求後台介面的網域名稱
2.在**中呼叫設定好的引數,
比如我在本專案中重新封裝axios(api檔案在/src/api/index.js中),將配置好的介面位址作為baseurl拼接到介面路徑中,應用引數部分如下:
最後重新啟動專案就可以了,當npm run dev的時候就執行在生產環境,當npm run build的時候就是正式的線上環境.
在main.js 做如下配置：
可能會遇到報錯：importaxiosfrom'axios'axios.defaults.baseurl = ''vue.prototype.axios = axios將axios配置到vue原型中，使用方法為：this.axios.get('/test/1').then(function(response) {}）
cannot read property 'protocol' of undefined
這是因為axios不能使用 vue.use(axios) 方式引用，需要使用原型方式引入
跨域:客戶端請求服務端的資料是存在跨域問題,在使用axios的時候會發現沒有jsonp的請求方式,所以如果要使用axios直接進行跨域訪問是不可能的,這樣就需要配置**了.
打包後資源相對引用路徑的和背景路徑問題
vue專案中若要使用相對路徑來獲得相應靜態資源，需要修改以下內容來確保專案打包後能正常執行。
1、修改config => index.js => build => assetspublicpath 中的'/'成為'./'
vue 專案打包
作為乙個前端之前並沒有打包過專案，因此想一下打包的效果，記錄一下我的打包過程 作為乙個開端 首先，專案打包前的目錄結構 然後，執行命令列 npm run build 因為是第一次打包，不熟悉打包的過程，與檔案的變更，首先看了一下檔案的結構，發現沒有compenent與views中檔案的生成目錄。是沒...
vue專案打包
首先開啟config index.js，將assetspublicpath值改為 注意是build的一對花括號裡 assetspublicpath 這個在你的build的一對花括號裡，用來解決js,css路徑問題 然後開啟 build utils.js 加上publicpath 如下 return ...
Vue專案打包
解決方法 配置vue.config.js如下 module.exports 使用npm run build命令進行打包，但是直接開啟index.html是無法看到內容的，因為無法載入其中的內容，所以必須使用伺服器來開啟網頁，這裡以express伺服器為例檢視 1.全域性安裝express gener...