使用whistle代理react本地应用

为什么要使用whistle

• 远程客户环境关掉sourceMap无法线上调试
• 微服务下本地开发本模块无法调试其他线上模块
• 想直接启动本地调试远程客户线上环境

怎么使用（以Mac为例）

一、 全局安装

	npm install -g whistle

二、 启动 Whistle

	w2 start

三、 配置代理 1、访问你要代理的远程客户地址：例如：https://a.com 2、找到network下的文档并全量复制 3、打开浏览器访问代理控制面板地址：http://127.0.0.1:8899，找到Values菜单下，新建一个proxy.html，名字可以随便取，拷贝进刚刚我们复制的内容，增加本地的静态资源代理地址（最后会说为什么是dev-vendor.chunk.js，lib.bundle.js这两个，这个因项目而异）。 4、打开Rules，添加代理规则，这里需要将本地的静态资源与线上进行替换，其次是代理指定的静态文件到我们刚刚创建的proxy.html 5、w2 proxy 启动成功后，就可以效果预览 再次打开客户的线上环境，还是network的文档里，看看下面的地址是否被成功添加进去，有的话就是成功代理；

讲讲怎么看本地有哪些资源需要代理（上面第三点展开讲）

还是打开本地模块的network的文档下，可以看到是这两个静态文件走的调试，所以我们只需要特定的将这两个静态地址代理商就行。

whistle常见命令

1、 启动 Whistle：

w2 start

2、 重启 Whistle：

w2 restart

3、 停止 Whistle：

w2 stop

4、 查看 Whistle 状态：

w2 status

5、代理Whistle：

w2 proxy