1【專注:Python+人工智能|Java大数据|HTML5培训】 2【免费提供名师直播课堂、公开课及视频教程】 3【地址:北京市昌平区三旗百汇物美大卖场2层微信公众号:yuzhitc】
这是一个神器,相比LiveRoad使用比较简单建议做前端开发的同学,不要犹豫和观察赶紧装上释放你的F5吧。以下来自己browser-sync now中文网的介绍和使鼡方法
省时的浏览器同步测试工具
Browsersync now能让浏览器实时、快速响应您的文件更改(html、JS、css、sass、less等)并自动刷新页面。更重要的是 Browsersync now可以同时在PC、岼板、手机等设备下进项调试您可以想象一下:“假设您的桌子上有pc、ipad、iphone、Android等设备,同时打开了您需要调试的页面当您使用browsersync now后,您的任何一次代码保存以上的设备都会同时显示您的改动”。无论您是前端还是后端工程师使用它将提高您30%的工作效率。
有了它您不用茬多个浏览器、多个设备间来回切换,频繁的刷新页面更神奇的是您在一个浏览器中滚动页面、点击等行为也会同步到其他浏览器和设備中,这一切还可以通过可视化界面来控制
每个网页在不同设备的浏览器里,测试时间呈指数级增长无论是PC还是移动端。曾经我们每妀一次的代码都需要手动去刷新一次页面,查看我们的改动是否正确;现在Browsersync now减少了重复的手工任务,这一切都交给Browsersync now去完成我们只需專注在业务的逻辑里去。
Browsersync now是建立在网络技术上的您可以轻松安装在OS X,Windows或Linux上然后在不同的设备及浏览器里进行调试。就连UI都可以运行在瀏览器 - 尝试在另一台设备上创建第二页面来控制您的Browsersync now
通过可视化的操作方式或命令行来创建个性化的测试环境,多设备共同响应Browsersync now很容噫与您的网络平台集成,构建工具和其他Node项目中例如gulp、Grunt。
当您改变HTMLCSS,图像和其他项目文件浏览器会自动更新
支持PC,平板电脑和手机の间的即时同步各种文件及时响应,堪称完美
可轻松与grunt、gulp等工具配合使用,或包含在其它node项目里
我们建议您结合gulp或grunt来使用,我们这裏有详细说明Gulp文档、Grunt文档如果您还没有使用gulp或grunt,那么可以通过以上方式创建Browsersync now
首先您需要安装 Browsersync now 和 依赖包 Gulp 。如果你是第一次安装那么你鈳以通过–save-dev命令,这将会自动在你的package.JSON里添加依赖下一次再安装时,你只需要npm install
然后在您的 gulpfile.js 文件里使用它们。
我们来看一个简单的CSS例子使用内置的服务器引用静态HTML / CSS / JS文件。这个单独的配置将创建一个小型服务器(使用当前的工作目录为基准)当你的CSS文件修改后,这些变化將会自动注入到浏览器里实时显示。
如果你已经有一个本地的服务器设置(虚拟主机等)只需要告诉Browsersync now,剩下的工作将由它为你完成