问题标签 [gulp-browser-sync]

我使用 Vagrant VM 来重现我的生产服务器以进行本地 Web 开发。

主机运行 Windows 10，来宾在 Ubuntu 14.04 上运行 Nginx 1.10，VirtualBox 作为提供程序。

我想在开发过程中使用 Gulp 和 Browsersync 提供文件。这是我从 gulp serve 任务中的 browsersync 配置：

我设法让它与这个一起工作：

如此处所示的套接字配置：如何使 BrowserSync 与 nginx 代理服务器一起工作？

该站点，重新加载和浏览器同步效果很好。但是 UI 找不到需要的文件。

如何在 Browsersync 配置中为这些请求设置路由？如果不可能，有什么办法可以让它工作吗？

我通过 npm 使用带有 gulp 的 Visual Studio 2015。我安装了browser-sync依赖于chokidar.fsevents. 据我了解，仅在 MacOSX 上才需要此依赖项，因此安装失败并出现此错误：

我知道这只是一个警告，没有错误。但是VS告诉我没有满足依赖关系：

我能做些什么？

我使用 browsersync 的 gulp 设置似乎在检测 SCSS 文件的更改方面存在问题。它非常适合带有重新加载和检测的 SLIM。吞咽没有错误。唯一的问题是 browsersync 无法检测 SCSS 文件中的更改并重新加载或注入更改。

我是 Gulp 和 BrowserSync 的新手，所以我一直在运行 gulp 并多次停止（由终端中的 ctrl + z 强制）。每次我在终端中再次启动 gulp 时，BrowserSync 都会给我一个新的端口号。

我需要帮助删除旧的 BrowserSync 实例。终端中是否有可以查看和删除旧 BS 实例的命令？这甚至可能吗？我在端口 3001（本地）和 3002（UI）开始 BS，现在我在 3018！我想回到3001。

另外，如何修复我的 Gulpfile.js 代码，以便当我在终端中强制停止 gulp 时，browserSync 退出本地和 UI 服务器实例，因此端口号不会继续增加？

我在 Gulpfile.js 中的 BrowserSync 部分非常基础：

在我的mac终端中，最新的BS实例在30018，而UI恰好在3021（因为我最近使用了bs.server.close()，它关闭了Local实例，但没有关闭UI实例。

我们如何为 gulp browserSync 定义浏览器。我在 ubuntu 16.04 上，我的机器上安装了 chrome、firefox 和 firefox developer edition，我希望 gulp browserSync 打开 firefox developer edition。我怎样才能做到这一点？这是我的配置：

背景

我有一个由另一个开发人员编写的 gulp.js 构建系统；至于我自己，我完全没有 gulp 的背景。为了避免 gulp 弄乱我的系统，我尝试在 Vagrant VM (Ubuntu Trusty 64) 中安装和运行 gulp。Gulp 似乎已正确安装。

问题

运行时gulp，运行任务，然后打印访问信息：

其次是错误：

我的一个朋友在 Windows 上运行它并没有遇到这个问题。有人知道从哪里开始解决这个问题吗？

我试过的

除了对搜索引擎的一些徒劳的研究之外，我还评论了 Gulpfile 中与 相关的任何行browserSync，这可以防止错误被抛出，但也删除了所有 webserver/reload 功能。

我有一个 Jekyll 站点，它是 Gulp 项目的一部分，使用 BrowserSync 来预览站点的构建。我的其中一个watch语句会查找对 的更改以html自动刷新站点。

按设计工作。

但是，当我更新（或任何其他共享文件）时，浏览器会多次header.html刷新，因为所有页面都已更改。这是有道理的，因为所有静态页面都在更新。但是我想在更新共享文件时防止这种情况发生。

有没有办法告诉 Gulp/BrowserSync 在共享 Jekyll 文件更新时只刷新一次？

更新

我的手表套装如下所示：

docs:build任务：

在执行“var bs = browserSync.create();”之前，如果 browserSync 进程正在运行，我想终止 browserSync。

exit() 方法需要 browsersync 实例是否正确？( https://www.browsersync.io/docs/api#api-exit )

什么是最好的方法 ？

//一个gulp脚本

//步骤 1 --- 杀死 browsersync

?

//Step2 --- 开始浏览器同步

我正在使用最新的 gulp sass 和 browsersync。编辑和保存 scss 文件后，它会编译，我看到“injecting styles.css”但浏览器也会重新加载。

不确定何时更改，但它过去只是注入新的 css 文件而无需重新加载。

我的任务：

有一次，我使用过滤器仅将 css 文件通过管道传输到 browsersync，因为有人告诉我地图文件正在触发重新加载。不确定我是否真的需要这样做，因为大多数在线示例都与我在这里的示例一样...

经过几天的深入研究，我似乎已经接近了这个设置，但仍然无法让 BrowserSync 使用 Nginx 作为带有 Nginx 来宾的 Vagrant Ubuntu 14.04 上的服务器并在我的 MacBook Pro 主机上查看 html。但是，在我的 Mac Chrome 浏览器上的http://localhost:3001/上，我可以查看带有设置等的 BrowserSync 页面。因此，我怀疑我做对了一些事情，但可能不多。

我希望看到 Foundation 启动页面，但我得到“无法访问此站点”。在我修改 gulpfile 之前，我可以使用 localhost:8079 查看启动页面，这是通常的设置，因此 Foundation 工作正常。

我试过 localhost: 3000、3001 和 3002 以及那些带有 Vagrant IP 10.0.2.15 和 127.0.0.1 和 0.0.0.0 的端口。有人有适用于这个堆栈的设置吗？我在任何地方都找不到这个设置的讨论。

我的 gulpfile 的相关部分。我正在修改 Foundation for Apps 的设置。

我从论坛上得到了这个代码。我还尝试了其他类似的配置。我已经注释掉了 Foundation 服务器设置，因为我想使用 Nginx 进行开发。我有限的理解是，如果我在 BrowserSync 中使用“服务器”，我会得到一个像 Foundation 一样的小型开发服务器。

在 Gulpfile 的底部，我们做了 watch thingy。

运行“基础观察”后，我得到了这个：

我的 Vagrantfile 有端口转发。前三个按预期工作。

这个 URL 也可以用来查看由 Nginx 提供的 Foundation 启动页面。我还没有研究过 Nginx，但一步一步地学习。我必须弄清楚如何为静态和动态文件设置服务器。

当然感谢帮助。如果使用此堆栈的任何人想要一个通往出色开发环境的快捷方式，我将我的 Vagrant 设置文件放在这里：https ://github.com/svstartuplab/Vagrant-Foundation-Sails-Nginx