响应式网站开发跨平台真机调试工具

因为在为官网适配手机等设备，所以希望能让本地的站点不必上传到服务器就可以在手机中预览。网上给出的方案不少，但是真正可用，并且操作简单的并不多。ios的比较好解决，android的可以用BrowerSync，这是个命令行工具，要使用Node.js来安装。这里要介绍的是Adobe家的一套edge cc工具集中提供的两个工具来实现开发中在手机实时预览，因为这套工具同时支持iOS和Android，所以可以支持跨平台。
需要用的工具是：

• Adobe edge inspect cc
• Adobe edge code cc
• Android版 edge inspect cc。
  -**
  1. 安装好后，打开pc端的edge inspect cc。
  
  edge inspect cc
  
  需要用Adobe的账号登陆才可以使用。

2. 打开pc端的edge code cc。

edge code cc

code cc 是一款轻量级的开发工具，支持html , css , javascript等语言。code cc的界面简洁，左边是文件树，右边是快捷工具键，上边是菜单，中间一大块区域就是代码编辑区，可以看全整行代码，不用像其他开发工具那样要左右滑动才能看全整行代码。

3. 点击code cc 快捷工具键里的预览工具。

手机图标

4. 打开手机端的inspect cc ，连接PC端的code cc 。

在手机端输入IP地址

连接成功以后，手机端的inspect cc 就会显示PC端chrome浏览器的页面。

chrome浏览器

5. 在手机上预览本地网站。
这时候可以看到手机端的inspect cc 已经可以预览chrome浏览器的网页了，但是在chrome地址栏里输入本地主机的地址，却没办法预览本地的网站。
因为还需要code cc里面配置调试本地网站。在code cc 里面菜单栏File/Open Folder ,打开本地网站。最后点击快捷菜单键最上面的调试键（闪电样式）。

闪电

然后，当我们再回到手机端inspect cc 里查看的时候，可以看到已经变成本地站点的页面了。