最近在開發(fā)移動端Vue移動端項(xiàng)目，查了一些資料，這里分享下如何在webpack工具構(gòu)建下的vue項(xiàng)目，在手機(jī)端調(diào)試和預(yù)覽，言歸正傳。

1.電腦和手機(jī)連接到同一個WIFI

a.臺式電腦和手機(jī)同時鏈接一個路由器，使用同一個wifi；

b.筆記本也可以直接啟用一個wifi，手機(jī)鏈接筆記本wifi也可以；

2.查詢本地IP地址

WIN+R，輸入cmd回車，打開命令提示符，輸入ipconfig，查看本地IPv4；

3.修改本地項(xiàng)目中IP地址

找到項(xiàng)目中config文件夾，下面index.js文件打開；

找到host: ‘localhost’, 改為上面本地IPv4地址；

module.exports = {dev: { host: ’192.168.0.107’, // 原為: hotst: ’localhost’ }}

4.制作二維碼

借助二維碼生成工具修改后項(xiàng)目生成二維碼。當(dāng)然不嫌麻煩，地址欄手動輸入也可以。https://cli.im/

5.重新啟動項(xiàng)目

重新啟動項(xiàng)目，然后瀏覽器地址輸入本機(jī)地址http://192.168.0.107:8080 訪問項(xiàng)目PC端項(xiàng)目；

然后，手機(jī)微信掃描二維碼就可以訪問啦！

以上這篇Vue移動端項(xiàng)目實(shí)現(xiàn)使用手機(jī)預(yù)覽調(diào)試操作就是小編分享給大家的全部內(nèi)容了，希望能給大家一個參考，也希望大家多多支持好吧啦網(wǎng)。