使用browser-sync进行页面的实时监听

咱们在写页面的时候如果不用框架或者webpack之类的自动化工具，每次修改一个样式或者一个js，就得自己手动刷新一下页面，这对于追求高效率的我们来说是很浪费时间的，那么今天给大家来介绍一个工具—— browser-sync。
Browsersync能让浏览器实时、快速响应您的文件更改（html、js、css、sass、less等）并自动刷新页面。更重要的是 Browsersync可以同时在PC、平板、手机等设备下进项调试。您可以想象一下：“假设您的桌子上有pc、ipad、iphone、android等设备，同时打开了您需要调试的页面，当您使用browsersync后，您的任何一次代码保存，以上的设备都会同时显示您的改动”。无论您是前端还是后端工程师，使用它将提高您30%的工作效率。
接下来就来给大家介绍具体的使用：
1。首先下载安装：
npm install -g browser-sync

安装完成以后检测：
browser-sync --version

2。OK，接下来咱们就进行监听了：
进入到需要监听的文件目录，打开命令行，执行命令：

browser-sync start --server --no-notify --files 'index.html,app/js/test.js'

（需要注意的是：这里要监听的只能是index.html，所以要监听那个文件之前先把文件名改一下，其实这样很不友好，应该有解决办法，等后续再说。）
解释一下，首先index.html是你监听的html文件，而这里比如你要监听的是test.html，你得先将名字改为index.html，等页面开发完成之后，再将文件名改回来。后面的app/js/test.js就是说在监听你的js文件，只要这两个文件有一个修改了，那页面就会自动刷新。
（监听时在每个文件后面加一个逗号再加一个空格，不然在多文件监听的时候，文件改动监听不上。）