因为在为官网适配手机等设备,所以希望能让本地的站点不必上传到服务器就可以在手机中预览。网上给出的方案不少,但是真正可用,并且操作简单的并不多。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。
需要用Adobe的账号登陆才可以使用。
2. 打开pc端的edge code cc。
code cc 是一款轻量级的开发工具,支持html , css , javascript等语言。code cc的界面简洁,左边是文件树,右边是快捷工具键,上边是菜单,中间一大块区域就是代码编辑区,可以看全整行代码,不用像其他开发工具那样要左右滑动才能看全整行代码。
3. 点击code cc 快捷工具键里的预览工具。
4. 打开手机端的inspect cc ,连接PC端的code cc 。
连接成功以后,手机端的inspect cc 就会显示PC端chrome浏览器的页面。
5. 在手机上预览本地网站。
这时候可以看到手机端的inspect cc 已经可以预览chrome浏览器的网页了,但是在chrome地址栏里输入本地主机的地址,却没办法预览本地的网站。
因为还需要code cc里面配置调试本地网站。在code cc 里面菜单栏File/Open Folder ,打开本地网站。最后点击快捷菜单键最上面的调试键(闪电样式)。
然后,当我们再回到手机端inspect cc 里查看的时候,可以看到已经变成本地站点的页面了。