如何在手机上调试h5

众所周知，我们做前端的写页面都是在电脑浏览器里调试，但是h5在浏览器手机模式和真机还是有区别的，所以这里记录下我的方法。

1. 如果是vue活着其他框架，只要使用webpack，或者自行搭建的webpack项目，将项目配置文件里面的config/index.js里面的host文件变成改成你的电脑的ip地址，这样就可以把你的电脑作为一个服务器，手机和电脑在同一个wifi下（同一个网络，意思是如果电脑用的是网线，手机是wifi，但只要是同一个网）就行，可以用草料二维码将链接生成二维码，手机微信，QQ，相机都可以扫描打开

   
   
   image.png
2. 如果只是普通的页面，不需要借助webpack的，只要能建立个服务器就行，我使用的是live-server

步骤：

（1） 建立新的文件夹，进入文件夹，npm init，把要打开的文件拖入

（2） npm install live-server 安装live-server

（3）在json里面修改IP改为本地ip，例如：

image.png

（4） npm run server，运行生成地址

同方法一，手机和电脑在一个wifi下，这样地址就可以用手机端访问了

其他也可以使用Apache HTTP Server