網(wǎng)站廣告費一般多少錢網(wǎng)頁生成app
問題：vue 項目配置反向代理導致項目白屏
一、現(xiàn)象描述
添加反向代理代碼后，前端運行白屏
// 設置baseURL，8888是后端端口號，前端請求默認發(fā)送到baseURL的地址
var axios = require('axios')
axios.defaults.baseURL = 'http://localhost:8888/api'
// 全局注冊，之后可在其他組件中通過 this.$axios 發(fā)送數(shù)據(jù)
Vue.prototype.$axios = axios
二、問題分析
通過F12查看控制臺
Uncaught TypeError: Cannot set properties of undefined (setting 'baseURL')
Uncaught TypeError: Cannot read properties of undefined 是一個 JavaScript 運行時錯誤，它表示試圖訪問一個未定義（undefined）對象的屬性。訪問對象是一個不存在的變量或者對象的屬性。
axios.defaults.baseURL = 'http://localhost:8888/api'
出問題的是這句話，注釋掉就能顯示。
代碼解釋（熟悉的同學可略過此節(jié)）
axios.defaults.baseURL = 'http://localhost:8888/api' 是一行JavaScript代碼，通常用于配置Axios庫的默認基礎URL。
-
axios: Axios 是一個基于 Promise 的 HTTP 客戶端，用于瀏覽器和 Node.js。它允許你發(fā)出GET、POST等HTTP請求。
-
defaults: 這是Axios對象的一個屬性，用于設置Axios的默認配置。
-
baseURL: 這是Axios默認配置中的一個屬性，用于設置請求的基礎URL。這意味著當你使用axios發(fā)起請求時，如果請求的URL以
baseURL開始，那么你不需要重復寫baseURL。 -
'http://localhost:8888/api': 這是你設置的基礎URL。這意味著當你使用axios發(fā)起請求時，除非你明確指定了不同的URL，否則都會基于這個URL。例如，如果你發(fā)起一個GET請求，而請求的URL是'/users'，那么實際發(fā)送的請求URL會是'http://localhost:8888/api/users'。
設置基礎URL的主要目的是為了簡化代碼和提高可讀性。例如，如果你有一個API端點是'/users'，那么你可以這樣發(fā)起請求：
axios.get('/users') ?.then(response => { ?console.log(response.data); ?}) ?.catch(error => { ?console.error(error); ?});
而不是這樣：
axios.get('http://localhost:8888/api/users') ?.then(response => { ?console.log(response.data); ?}) ?.catch(error => { ?console.error(error); ?});
通過設置基礎URL，你可以避免在每個請求中重復寫相同的URL前綴。
三、解決方案
1.檢查變量是否定義
2.使用默認參數(shù)
3.使用鏈式表達
博主的項目實際解決方法是通過
import axios from 'axios'
代替
// var axios = require('axios')
根本原因分析，先挖個坑。