您不可或缺的测试助手。

随着网页的增加、设备和浏览器的不断出新，测试时间呈指数级增长。从实时加载到 URL 推送、从复制到单击镜像，Browsersync 就像一双额外的手，取代了重复的手工劳动。从用户界面或命令行自定义一组同步设置，从而创建个性化的测试环境。需要更多的控制？Browsersync 很容易与 Web 平台、构建工具和其他 Node.js 项目集成。

与您当前所使用的构建工具集成，例如 Gulp 和 Grunt

出色的功能

在任何地方安装和运行

基于 Node.js 并支持 Windows、MacOS 和 Linux 操作系统。5分钟即可完成设置。

免费使用

Browsersync 是一个开源项目，采用 Apache 2.0 开源许可证。

兼容构建工具

很容易与 Grunt 和 Gulp 之类的构建工具集成，或者包含到其他 Node 项目中。

网络限流

即便您的设备连接的是 wifi，也可以模拟成较慢的网速测试你的站点。

交互同步

在测试时，您的滚动、单击、刷新和表单操作将映射到不同的浏览器上。

文件同步

当您修改 HTML、CSS、图片和其他项目文件时，浏览器将自动更新。

图形界面或命令行

可以选择使用基于浏览器的用户界面或命令行进行控制。

同步定制

切换单个同步设置就可以创建首选测试环境。

URL 历史

记录您的测试网址，您只需点击一次，就可以在不同设备里访问。

An open source project by JH

BrowserSync is an open-source project created and maintained by the front-end designers/developers at JH. Together with contributors from all over the world, we aim to make modern, multi-device web development faster & easier.

用户的认可

Dave Rupert

Want to feel like a modern day demigod? Fire up Browsersync and control an entire device lab with your phone.

Paravel and Shop Talk Show

Addy Osmani

It has a fantastic feature-set and at least 5 developers I’ve spoken to this week alone swear by it for their own synchronized cross-device testing.

Google and addyosmani.com

5分钟快速入门。

  1. 1. 安装 Node.js

    Browsersync 是一个 Node.js 模块（Node.js 是一个快速的网络应用平台）。MacOS、Windows 和 Linux 上各有便利地安装方式。

  2. 2. 安装 Browsersync

    npm 将从 Browsersync 仓库 中安装 Browsersync。打开一个命令行窗口，执行以下命令：

    npm install -g browser-sync

    上述命令告诉 npm 下载 Browsersync 文件并将其安装到全局环境中，这样就可以在任何项目中直接使用 Browersync 了。

  3. 3. 启动 Browsersync

    一个基本用途是，监听某个 css 文件，如果检测到文件修改就会同步到浏览器里。进入到项目目录下，根据项目类型运行相应的命令：

    静态网站

    如果你的网站只有 .html 文件，那么使用服务器模式即可。Browsersync 将启动一个微型服务器并提供一个 URL 来查看您的站点。

    browser-sync start --server --files "css/*.css"

    动态网站

    如果你已经使用 PHP 或类似工具在本地启动了一个服务器，那么使用代理模式即可。Browsersync 将提供一个代理 URL 来查看您的站点。

    browser-sync start --proxy "myproject.dev" --files "css/*.css"

用户指南

集成指南