简单-几种常见前端可视化工具

三种工具分别是

• livestyle(http://livestyle.io/)
  需要：chrome livestyle插件 sublime 插件
• livereload（http://livereload.com/）
  需要：浏览器插件livereload nodejs插件 npm install -g livereload
• browsersync(http://www.browsersync.cn/#install)不需要安装插件

简介

• BrowserSync是一个同步多浏览器页面测试工具，在IDE里面修改完文件，页面就会同步刷新
• BrowserSync除了自动刷新，默认配置下，BrowserSync
  会在打开你当前网页的所有浏览器中同步滚动条位置，表单行为和点击事件
• BrowserSync启动的时候会自动启动自带的静态的服务器,通过这个服务器来访问网页
• BrowserSync
  不需要安装任何的浏览器插件，就可以处理项目文件，不像livereload
  ，必须要安装浏览器插件

基本原理
当网页已连接到BrowserSync的时候，我们可以查看一下源码，会发现它们都被添加了与BrowserSync有关的一段