省时的浏览器同步测试工具--Browsersync，释放你的f5功能显示修改后的代码，按ctrl+s保存，页面就会同步实时刷新，按F5开启滚动同步功能后，滑动当前页面，其他浏览器中的相同页面和其他设备中的相同页面会同时滚动。对前端开发同学非常友好。特点[HotLoading]让浏览器实时快速响应文件变化。任何时候保存代码，PC、平板、手机等设备都会同时显示变化。使用它将使您的工作效率提高30%。工作效率（热加载）【页面同步】在一个浏览器中滚动页面和点击也会同步到其他浏览器和设备，所有这些也可以通过可视化界面进行控制。【兼容性】无需安装浏览器插件即可使用。兼容移动端、PC端等多种设备。浏览器可以直接访问ip+端口。liveReload的区别（为什么要用）和liveReload的区别LiveReload需要浏览器插件。插件是依赖浏览器的，chrome和firefox都有插件可用，但是IE，或者手机上的浏览器不能正常使用，一般使用BrowserSync不需要浏览器插件所以都可以使用平台。与vue的热加载不同的是，vue的热加载功能是建立在vue-cli脚手架上的，而BrowserSync不需要搭建任何框架，使用起来更快捷。一般来说，BrowserSync可以忽略浏览器、设备和框架。Browsersync的工作原理是在
标签后插入初始请求()异步脚本标签，标签必须存在才能正常工作。安装安装Node.jsBrowserSync是基于Node.js的，是一个Node模块。全局安装BrowserSync使用npminstall-gbrowser-sync结合gulpjs等构建工具使用（browserSync初体验）启动BrowserSync正常使用（静态项目使用browsersync）在项目目录下打开一个命令窗口（目录名不能是aChinesename)inthecommand在窗口中输入代码（BrowserSync会在输入命令后启动一个小型服务器并提供一个URL来查看你的网站。)//监控css文件browser-syncstart--server--files"css/*.css"//监控css和html文件（如果需要监控多种类型的文件，用逗号分隔即可）browser-syncstart--server--files"**/*.css,**/*.html,**/*.js"使用代理模式（动态项目使用browsersync，如果有其他本地服务器环境）BrowserSync传递代理URL(localhost:3000)查看网站//主机名可以是ip或者域名browser-syncstart--proxy"hostname""css/*.css"结合配置文件在控制台输入browser-sync/commandwindowinit，会在当前目录下生成一个配置文件bs-config.js。修改完配置文件后，在控制台输入browser-syncstart--configbs-config.js，bs-config.js的完整配置信息将使用RunBrowserSync。常用配置文件//单个文件browserSync({files:"app/css/style.css"});//多个文件browserSync({files:["app/css/style.css","app/js/*.js"]});//format+1自定义回调//2.6.0自browserSync({files:["wp-content/themes/**/*.css",{match:["wp-content/themes/**/*.php"],fn:function(event,file){/**自定义事件处理程序**/}}]});server创建基本的HTML/JS/CSS网站。//从应用程序目录中的文件服务server:{baseDir:"app"}//从应用程序目录中的文件提供目录列表server:{baseDir:"app",directory:true}//多个基本目录server:{baseDir:["app","dist"]}//从应用目录提供文件，指定一个特定的文件名作为索引server:{baseDir:"app",index:"index.htm"}//自版本1.2.1//key为URL匹配//value为提供的文件夹（相对于当前工作目录）server:{baseDir:"app",routes:{"/bower_components":"bower_components"}}//自定义中间件server:{baseDir:"./",middleware:function(req,res,next){console.log("Hifrommiddleware");下一个（）;}}//多个自定义中间件服务器：{baseDir:"./",middleware:[function(req,res,next){console.log("Hifromfirstmiddleware");下一个（）;},function(req,res,next){console.log("来自第二个中间件的嗨");下一个（）;}]}portspecifyportnumber//使用（而不是Browsersync自动检测到的端口）特定端口port:8080httpsenableHTTPSlocalhost。注意-这对于代理选项不是必需的，因为它将从您的目标URL中推断出来。//启用HTTPS静态文件服务器browserSync({server:"./app",https:true});//启用HTTPS片段模式browserSync({https:true});ghostModeClick,scrollandformonanydevice输入将被镜像到所有设备（当然你必须正确使用Url）//在这里你可以禁用/启用每个单独的功能ghostMode:{clicks:true,forms:true,scroll:false}//或enable都一口气关闭ghostMode:falseopen确定Browsersync启动时自动打开的URL。默认为“本地”，如果未设置//停止自动打开浏览器open:false//打开本地主机URLopen:"local"//打开外部URL-必须在线open:"external"//打开UI-自2.0起。0open:"ui"//打开隧道网址——还必须设置`tunnel`选项chrome,在firefix浏览器下打开站点:["googlechrome","firefox"]startPath指定起始路径，打开浏览器//在URL+"/info.php"startPath:"/info.php》更多配置信息请访问官网：http://www.browsersync.cn/doc...browserSyn常用命令行browserSync命令行方法常用命令行方法：browser-syncstart