vue 本地服務(wù)不能被外部IP訪問的完美解決方法
解決 webpack-dev-serveri
啟動(dòng)后通過外部訪問報(bào)錯(cuò) 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, } }
啟動(dòng)后就可以通過 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 本地服務(wù)不能被外部IP訪問的解決方法,希望對(duì)大家有所幫助,如果大家有任何疑問請(qǐng)給我留言,小編會(huì)及時(shí)回復(fù)大家的。在此也非常感謝大家對(duì)腳本之家網(wǎng)站的支持!
相關(guān)文章
vuex存儲(chǔ)數(shù)據(jù)的幾種方法實(shí)例詳解
在瀏覽網(wǎng)頁時(shí)我們有些時(shí)候需要記住一些用戶選擇的信息,比如登陸時(shí)我們?nèi)绻x擇了記住密碼,那么我們下次進(jìn)入該網(wǎng)頁時(shí)就會(huì)有你上次的登陸信息,下面這篇文章主要給大家介紹了關(guān)于vuex存儲(chǔ)數(shù)據(jù)的幾種方法,需要的朋友可以參考下2022-10-10使用Vue動(dòng)態(tài)生成form表單的實(shí)例代碼
這篇文章主要介紹了使用Vue動(dòng)態(tài)生成form表單的實(shí)例代碼,非常不錯(cuò),具有參考借鑒價(jià)值,需要的朋友可以參考下2018-04-04Xx-vue自定義指令實(shí)現(xiàn)點(diǎn)擊水波紋漣漪效果
這篇文章主要為大家介紹了Xx-vue自定義指令實(shí)現(xiàn)點(diǎn)擊水波紋漣漪效果,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2023-07-07使用vue實(shí)現(xiàn)通過變量動(dòng)態(tài)拼接url
這篇文章主要介紹了使用vue實(shí)現(xiàn)通過變量動(dòng)態(tài)拼接url,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。一起跟隨小編過來看看吧2020-07-07淺談在vue項(xiàng)目中如何定義全局變量和全局函數(shù)
本篇文章主要介紹了淺談在vue項(xiàng)目中如何定義全局變量和全局函數(shù),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2017-10-10vue-cli 3.0 引入mint-ui報(bào)錯(cuò)問題及解決
這篇文章主要介紹了vue-cli 3.0 引入mint-ui報(bào)錯(cuò)問題及解決方案,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方,望不吝賜教2022-05-05vue通過krpano.js實(shí)現(xiàn)360全景圖的實(shí)例代碼
這篇文章主要介紹了vue上通過krpano.js實(shí)現(xiàn)360全景圖,本文通過實(shí)例代碼給大家介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2023-10-10解決Vue的項(xiàng)目使用Element ui 走馬燈無法實(shí)現(xiàn)的問題
這篇文章主要介紹了解決Vue的項(xiàng)目使用Element ui 走馬燈無法實(shí)現(xiàn)的問題,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。一起跟隨小編過來看看吧2020-08-08