vue項目開發中devServer.proxy使用

背景：咱們在項目開發中，通常狀況下前端應用和後端 API 服務器是沒有運行在同一個主機上的，若是直接訪問後端接口的話就會報錯，先後端代碼以下圖所示：



處理方式爲須要在開發環境下將 API 請求代理到 API 服務器。這個問題能夠經過vue.config.js中的devServer.proxy選項來配置，配置以後須要從新啓動便可正常訪問，以下圖所示：


測試補充：vue啓動的node服務器和spring boot啓動的tomcat順序存在前後，測試發現，當先啓動vue項目，默認使用8080端口，就會致使tomcat啓動報錯，提示8080端口被佔用；若先啓動tomcat，它默認使用8080端口，而再啓動vue項目會使用例如8083不會致使衝突。
補充：修改vue.config.js文件後須要從新啓動項目才能生效，此文件位於node_modules/@vue/cli-service/lib/Service.js中，執行npm run serve後纔會讀取到這個配置文件(對於整個啓動流程暫不是很是清楚，若有問題，歡迎指正)