解決 webpack-dev-server 不能使用 IP 訪問


webpack 是眾所周知很好用的打包工具,在開發 vue 項目時,vue-cli 就集成了 webpack。
我們啟一個服務:npm run dev
然后在瀏覽器可是使用 http://localhost:8080 訪問,但是當我們遇到移動端項目時,需要在手機端訪問,所以要把 localhost 換成本地 IP 地址,例如:http://192.168.x.xx:8080,你會發現移動端無法使用 IP 訪問。

解決方案

第一種方法:
找到 your-project/build/webpack.dev.conf.js

// const HOST = process.env.HOST const HOST = '192.168.x.xx:8080'

然后保存,重新啟動一下服務,會發現 PC 地址欄已經變成:
http://192.168.x.xx:8080 了,然后手機試一試,沒問題。


第二種方法:
找到 your-project/package.json

"dev": "webpack-dev-server --inline --progress --config build/webpack.dev.conf.js"

在這句話里面添加參數 --host 0,0,0,0

"dev": "webpack-dev-server --inline --host 0.0.0.0 --progress --config build/webpack.dev.conf.js"

然后在 PC 地址欄輸入:http://192.168.x.xx:8080 or localhost or 0.0.0.0 都可以訪問,手機使用 IP 訪問也是沒問題。


最后提醒大家,手機可以訪問的前提是:手機和電腦需要連的同一個 wifi

 

轉載:https://www.cnblogs.com/cowboybusy/p/10991887.html


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM