移动端开发真机调试神器

前言：博主翻山越岭，找了很久的真机调试，从老古董，weinre，到微信开发者工具，到最后的browser-sync，最后这个工具真的是眼前一亮～

［本篇博客默认你已会使用gulp，npm～并且环境已经搭好］

1.npm init

找到目录中的 package.json，在文件中添加相关依赖包

1 "dependencies": {
2   "async-each-series": "^1.1.0",
3   "connect-history-api-fallback": "^1.3.0",
4   "weinre": "^2.0.0-pre-I0Z7U9OV"
5 }

2.npm install 安装相关依赖文件

3.新建gulpfile.js文件，添加下面相关代码

引入组件

1 var browserSync = require('browser-sync').create();  //自动同步

添加任务

 1 gulp.task('browser-sync',function () {
 2     var files = [
 3         '**/*.html',
 4         '**/*.css',
 5         '**/*.js'
 6     ];
 7 //代理模式（本地服务器）
 8     browserSync.init(files,{
 9         proxy: 'http://localhost:63342/nonghui/extend.html?_ijt=5d9fjooo2tdvvf1uh6tb8qmlma#/index',  //此处根据项目实际目录填写
10     });
11 //本地静态文件
12 //     browserSync.init(files, {
13 //         server: {
14 //             baseDir: './src'   //该路径到html的文件夹目录
15 //         }
16 //     });
17 });