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