记得在学习Nodejs的时候有一个很好的Node模块吸引了我,它能对我修改的某一个css, js 或者目录的变化进行监控,而后咱们能够经过浏览器来查看监听的服务下文件发生的变化!
下面我来简单的介绍一下它 固然咱们也能够去官网直接找对应的使用文档,官网也是讲解的很是详细的php
下面是我对Browersync使用的一个过程,但愿对新手有点用处css
首先BrowserSync是基于Node.js的, 是一个Node模块, 若是您想要快速使用它,也许您须要先安装一下Node.js
npm库中安装 BrowserSync :html
//Mac下全局安装请在命令前加sudo npm install -g browser-sync
固然您也能够结合gulpjs或gruntjs构建工具来使用,在您须要构建的项目里运行下面的命令:vue
npm install --save-dev browser-sync
好比咱们要对这个vue项目中的index.html 及 index.js进行检测进行监测命令以下:npm
监控文件index.html 与index.js 文件的变化gulp
browser-sync start --server -no-notify --file='index.html,index.js'
若是有更深层次文件的监测能够使用以下命令:浏览器
browser-sync start --server --files '**/*.css, **/*.html'
固然咱们也能够对咱们本身的项目开启代理监测 好比php类的项目:服务器
在本地建立了一个PHP服务器环境,并经过绑定Browsersync.cn来访问本地服务器,使用如下命令方式,Browsersync将提供一个新的地址localhost:3000来访问Browsersync.cn,并监听其css目录下的全部css文件。grunt
browser-sync start --poerxy 'www.fanxiao2.net' '**/.'
本文转载至 范骏 的博客工具