相关链接：
Browsersync官网
Browsersync中文网
前言：1分钟快速使用 Browsersync
- 下载安装 nodejs
- 命令行窗口 ( 全局安装 browsersync )：
npm install -g browser-sync - 在 项目文件夹 内同时按住 shift 和 右击，可以看到
在此处打开命令窗口, 点击打开命令行窗口 - 在命令行窗口内输入以下命令
browser-sync start --server --files "**"
( 启动 Browsersync，--server 默认以当前目录为服务器根目录，--files 后面要记得空一格再写要监听的文件，**表示监听所有文件，一旦文件修改浏览器自动刷新，适合小型项目 ) - 最实用的两大功能：代码文件修改并保存后浏览器页面自动刷新，同一局域网下手机（连 WIFI）可进行页面的联调。
PS：下面内容的 1-3 部分是官网工具介绍的中文翻译，仔细阅读的话可对该工具有更深入的了解，也可略过直接跳到第 4 部分进行阅读。
1. 概述
Browsersync是您不可或缺的测试工具。
针对越来越多的网站页面、各种设备和多个浏览器，我们在测试代码上花费的时间越来越多。从实时刷新页面、URL发布到表单拷贝、点击事件镜像，Browsersync 减少了重复的手动操作，就像是多出了一双手一样。在UI界面或命令行中自定义一系列的同步设置，创建一个个性化的测试环境。Browsersync 很容易集成到您的web平台、构建工具和其他 Node.js 项目中。
2. 主要功能
-
Browsersync 能让浏览器实时、快速响应您的文件更改（html、js、css、sass、less等）并自动刷新页面。更重要的是 Browsersync 可以同时在PC、平板、手机等设备下进行调试。
Browsersync
图片来自 Browsersync 中文官网 -
在一个浏览器中滚动页面、点击等行为也会同步到其他浏览器和设备中，这一切还可以通过可视化界面来控制。
Browsersync
图片来自 Browsersync 中文官网
3. 所有特性
Install and run anywhere
基于Node.js构建，支持 Windows, MacOS 和 Linux 平台。5分钟快速搭建。Free to run and reuse
Browsersync 是一个开源项目，可根据 Apache 2.0 许可使用和修改。Build-tool compatible
可以轻松集成到自动化工具中，如 Grunt 和 Gulp，或其他 Node 项目中。Network Throttle
在网络连接速度慢的情况下也可以测试你的网页，就算设备连接的是 Wifi。Interaction sync
当你测试时，你对页面的滚动、点击、刷新和表单操作都将在所有浏览器中同步显示。File sync
当你修改 HTML, CSS, 图片或其他项目文件时，浏览器都会自动刷新UI or CLI control
可以使用基于浏览器的 UI 界面来进行快速操作，也可以使用命令行工具。Sync customisation
切换个人同步设置来创建你喜欢的测试环境。URL history
记录你测试过的 URL，只要一键就能允许你重新在所有设备上打开该页面。
4. 5分钟快速入门
- 安装 Node.js
下载地址在这里。 - 安装 BrowserSync
方法一：使用 npm 安装
打开一个终端窗口，运行以下命令:
npm install -g browser-sync
方法二：结合gulpjs或gruntjs构建工具使用
在您需要构建的项目里运行下面的命令：
npm install --save-dev browser-sync
方法一安装完后在命令行中输入browser-sync，回车，会看到关于这个插件的一些使用说明。
相关的命令行说明：
Browsersync 官网命令行说明
Browsersync 中文网命令行说明
常用命令:
--files
File paths to watch / 后面跟要监听的文件路径
--server
Run a Local server (uses your cwd as the web root) / 运行一个本地服务器（使用您的 当前工作目录 作为 Web 根目录）
--proxy
Proxy an existing server / 代理一个现有的服务器
--config
Specify a path to a bs-config.js file / 指定 bs-config.js peizhi文件的路径
- 启动 BrowserSync
小贴士：按住 Shift 键，右键点击文件夹，可以看到
在此处打开命令行窗口，点击后，命令行窗口的 当前工作目录 即为此文件夹。
命令行使用示例：
#Server Example（服务器模式，针对静态网页）:
---------------
// Use current directory as root & watch CSS files
// BrowserSync 将以当前路径为根目录创建一个小型服务器，并提供一个URL地址来查看您的网站 & 监听 CSS 文件
在命令行窗口中运行下面命令：
browser-sync start --server --files "css/*.css"
#Proxy Example（代理模式，针对已经有本地服务器的环境）:
---------------
// Proxy 'localhost:8080' & watch CSS/HTML files
// 代理地址（ip 或域名） "localhost:8080" & 监听 CSS/HTML 文件
在命令行窗口中运行下面命令：
browser-sync start --proxy "localhost:8080" --files "*.html,css/*.css"
5. 须知
- --files 后的文件路径是相对于运行该命令的当前目录的
browser-sync start --server --files "css/*.css" - 如果您需要监听多个类型的文件，您只需要用逗号隔开
browser-sync start --server --files "css/*.css, *.html" - 如果你的文件层级比较深，您可以考虑使用 **（表示任意目录）匹配
//任意目录下任意 .css 或 .html 文件
browser-sync start --server --files "**/*.css, **/*.html"
