browsersync使用

記得在學習Nodejs的時候有一個很好的Node模塊吸引了我，它能對我修改的某一個css, js 或者目錄的變化進行監控，而後咱們能夠經過瀏覽器來查看監聽的服務下文件發生的變化！
下面我來簡單的介紹一下它 固然咱們也能夠去官網直接找對應的使用文檔，官網也是講解的很是詳細的

官網地址：browsersync

下面是我對Browersync使用的一個過程，但願對新手有點用處

首先BrowserSync是基於Node.js的, 是一個Node模塊， 若是您想要快速使用它，也許您須要先安裝一下Node.js
npm庫中安裝 BrowserSync :

全局安裝

//Mac下全局安裝請在命令前加sudo
npm install -g browser-sync

固然您也能夠結合gulpjs或gruntjs構建工具來使用，在您須要構建的項目裏運行下面的命令:

npm install --save-dev browser-sync

啓動browsersync 也很是簡單

好比咱們要對這個vue項目中的index.html 及 index.js進行檢測進行監測命令以下：

監控文件index.html 與index.js 文件的變化

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文件。

browser-sync start --poerxy 'www.fanxiao2.net' '**/.'

本文轉載至   範駿  的博客