Vue移動端項目如何使用手機預覽調試


 

最近在開發移動端Vue移動端項目,查了一些資料,這里分享下如何在webpack工具構建下的vue項目,在手機端調試和預覽,言歸正傳。

1.電腦和手機連接到同一個WIFI

a.台式電腦和手機同時鏈接一個路由器,使用同一個wifi; 

b.筆記本也可以直接啟用一個wifi,手機鏈接筆記本wifi也可以;

2.查詢本地IP地址

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

3.修改本地項目中IP地址

找到項目中config文件夾,下面index.js文件打開; 

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

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

  

4.制作二維碼

借助草料二維碼生成修改后項目地址的二維碼,https://cli.im/

5.重新啟動項目

重新啟動項目,然后瀏覽器地址輸入本機地址http://192.168.0.107:8080 訪問項目PC端項目; 
然后,手機微信掃描二維碼就可以訪問啦

 

 

原文鏈接

https://blog.csdn.net/Lynn_yu/article/details/79912854


免責聲明!

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



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