vue 本地服務不能被外部IP訪問的完美解決方法
更新時間：2018年10月29日 14:08:49 作者：大猩猩X
這篇文章主要介紹了vue 本地服務不能被外部IP訪問的解決方法,本文通過代碼講解的非常詳細，需要的朋友可以參考下
解決 webpack-dev-serveri 啟動后通過外部訪問報錯 invalid host header
修改 config/index.js 的 host 屬性為 ‘0.0.0.0'
{
// ...,
host: '0.0.0.0',
port: 8080,
// ...
}
修改 build/webpack.dev.conf.js 的 devServer 配置
增加 disableHostCheck = true
devServer: {
clientLogLevel: 'warning',
historyApiFallback: true,
hot: true,
compress: true,
host: HOST || config.dev.host,
port: PORT || config.dev.port,
open: config.dev.autoOpenBrowser,
overlay: config.dev.errorOverlay
? { warnings: false, errors: true }
: false,
publicPath: config.dev.assetsPublicPath,
proxy: config.dev.proxyTable,
quiet: true, // necessary for FriendlyErrorsPlugin
disableHostCheck: true,
watchOptions: {
poll: config.dev.poll,
}
}
啟動后就可以通過 IP 訪問了，比如 IP 為 192.168.1.100
PS：vue把localhost改成ip地址無法訪問—解決方法
打開package.json文件，找到下面的代碼
"scripts": {
"dev": "webpack-dev-server --inline --progress --config build/webpack.dev.conf.js",
"start": "npm run dev",
"build": "node build/build.js"
},
改成
"scripts": {
"dev": "webpack-dev-server --inline --progress --config build/webpack.dev.conf.js --host 192.168.0.114",
"start": "npm run dev",
"build": "node build/build.js"
},
host后面是你的ip地址。
以上所述是小編給大家介紹的vue 本地服務不能被外部IP訪問的解決方法，希望對大家有所幫助，如果大家有任何疑問請給我留言，小編會及時回復大家的。在此也非常感謝大家對腳本之家網(wǎng)站的支持！
相關(guān)文章
在瀏覽網(wǎng)頁時我們有些時候需要記住一些用戶選擇的信息,比如登陸時我們?nèi)绻x擇了記住密碼,那么我們下次進入該網(wǎng)頁時就會有你上次的登陸信息,下面這篇文章主要給大家介紹了關(guān)于vuex存儲數(shù)據(jù)的幾種方法,需要的朋友可以參考下2022-10-10
這篇文章主要介紹了websocket在vue2中的封裝使用方式,具有很好的參考價值,希望對大家有所幫助,如有錯誤或未考慮完全的地方,望不吝賜教2024-08-08
這篇文章主要介紹了使用Vue動態(tài)生成form表單的實例代碼,非常不錯，具有參考借鑒價值，需要的朋友可以參考下2018-04-04
這篇文章主要為大家介紹了Xx-vue自定義指令實現(xiàn)點擊水波紋漣漪效果，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進步，早日升職加薪2023-07-07
這篇文章主要介紹了使用vue實現(xiàn)通過變量動態(tài)拼接url，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2020-07-07
本篇文章主要介紹了淺談在vue項目中如何定義全局變量和全局函數(shù)，具有一定的參考價值，感興趣的小伙伴們可以參考一下2017-10-10
這篇文章主要介紹了vue-cli 3.0 引入mint-ui報錯問題及解決方案，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2022-05-05
vue通過krpano.js實現(xiàn)360全景圖的實例代碼
這篇文章主要介紹了vue上通過krpano.js實現(xiàn)360全景圖,本文通過實例代碼給大家介紹的非常詳細，對大家的學習或工作具有一定的參考借鑒價值，需要的朋友可以參考下2023-10-10
我們不光要學會Vue的組件化實現(xiàn)過程,還要懂得組件數(shù)據(jù)發(fā)生變化,更新組件的過程,這篇文章主要給大家介紹了關(guān)于Vue3組件更新過程的相關(guān)資料,需要的朋友可以參考下2022-04-04
解決Vue的項目使用Element ui 走馬燈無法實現(xiàn)的問題
這篇文章主要介紹了解決Vue的項目使用Element ui 走馬燈無法實現(xiàn)的問題，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2020-08-08