vue-cli項目無法用本機IP訪問的解決方法
更新時間：2018年09月20日 11:28:12 作者：jocchoc
今天小編就為大家分享一篇vue-cli項目無法用本機IP訪問的解決方法，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧
所遇問題
啟動vue-cli項目服務(wù)，用本機IP無法訪問此網(wǎng)站，拒絕了我們的鏈接請求。從而無法從手機上預(yù)覽效果
原因分析
在我們的bulid目錄下有一個webpack.dev.config.js的配置文件，發(fā)現(xiàn)devServer對象里的host屬性取自process.env.HOST || config.dev.host。
于是這里我們?nèi)ゲ榭碿onfig.dev.host。在我們的config目錄下有一個index.js, 找到dev對象的host屬性
發(fā)現(xiàn)該版本的vue-cli將host主機名定義為localhost, 從而導(dǎo)致了本地IP不能訪問服務(wù)。
解決辦法
將host重新定義為：0.0.0.0即可, 然后重啟服務(wù)，發(fā)現(xiàn)localhost、127.0.0.1、本地IP均能正常訪問，這樣就可以用手機來預(yù)覽效果啦
host: '0.0.0.0'
以上這篇vue-cli項目無法用本機IP訪問的解決方法就是小編分享給大家的全部內(nèi)容了，希望能給大家一個參考，也希望大家多多支持腳本之家。
相關(guān)文章
這篇文章主要介紹了在pycharm中開發(fā)vue的方法步驟，文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2020-03-03
這篇文章主要介紹了vue如何自定義按鈕單選和多選問題，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2023-07-07
Vue項目實現(xiàn)簡單的權(quán)限控制管理功能
這篇文章主要介紹了Vue項目實現(xiàn)簡單的權(quán)限控制功能，文中給大家介紹了兩種方式進行權(quán)限限制，本文通過實例代碼給大家介紹的非常詳細(xì),需要的朋友可以參考下2019-07-07
VUE前端導(dǎo)出文件之file-saver插件安裝使用教程
這篇文章主要給大家介紹了關(guān)于VUE前端導(dǎo)出文件之file-saver插件安裝使用的相關(guān)資料,file-saver是一個用于保存文件的JavaScript庫,它提供了一種簡單的方式來生成和保存文件,支持各種文件類型,例如文本文件、圖片、PDF等,需要的朋友可以參考下2024-05-05
本文內(nèi)容主要參考官方教程，為了方便理解，用更加通俗的文字講解Vuex，也原文內(nèi)容做一些重點引用。希望會對你有所幫助。2017-07-07
這篇文章主要為大家詳細(xì)介紹了vue3如何通過組合鍵,例如command+Enter、shift+Enter、alt + Enter,實現(xiàn)換行操作,感興趣的可以了解下2024-03-03
vue3中使用viewerjs實現(xiàn)圖片預(yù)覽效果的項目實踐
viewer.js是一款開源的圖片預(yù)覽插件,功能十分強大,本文主要介紹了vue3中使用viewerjs實現(xiàn)圖片預(yù)覽效果的項目實踐,具有一定的參考價值,感興趣的可以了解一下2023-09-09
下面小編就為大家分享一篇Vue的elementUI實現(xiàn)自定義主題方法，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2018-02-02
本篇文章主要介紹了vue過渡和animate.css結(jié)合使用詳解，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2017-06-06
footer為公用組件，其他頁面都需要引入。接下來通過本文給大家分享vue項目中公用footer組件底部位置的適配問題,需要的朋友可以參考下2018-05-05