前言
在前端开发过程中,时常遇到移动端需求。若是每次部署完成后再查看开发效果,可能过于费时费力,因而需要可直接完成真机测试的配置
方法一:无需部署,直接同步本地调试
一:查询电脑本地IP地址
1:ctrl/window+r输入cmd回车,打开命令提示符;
2:输入ipconfig,查看本地ip,具体如下
二:修改config
修改config中的配置,将host改为本地ip,具体如下:
三:手机访问链接
1:将手机与电脑连接同一无线
2:重启项目,生成链接,具体如下图:
3:至此即可完成所有配置,手机端访问network即可
其他方式
借用抓包工具:spy-debugger
方法二:借用vconsole打开控制台
有时候,需要在移动端打开控制台查看打印数据或者接口请求等;
一:下载插件vconsole
npm install vconsole
二:配置
import VConsole from 'vconsole';
const vConsole = new VConsole({ // 配置选项
defaultPlugins: ['system', 'network', 'element'],
// 默认开启的插件
onReady() {
console.log('vConsole is ready!');
},
});