问题标签 [gulp-browser-sync]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
1 回答
729 浏览

gulp - 浏览器同步重新加载不起作用

我正在尝试使用 gulp 配置浏览器同步,我想观看我的 scss 文件并将它们编译并保存在一个名为 dist 的文件夹中,当进行更改时,我还想在此过程完成后重新加载我的浏览器。到目前为止,我成功地在新窗口中观看、编译和加载结果,但是当在 scss 文件中进行进一步更改时,我无法刷新浏览器窗口..我在这里做错了什么?我也想知道这是否是正确的方法。

这是我的 gulpfile.js

0 投票
0 回答
611 浏览

proxy - Browsersync Https 代理不会注入 css 或重新加载浏览器

所以我正在使用浏览器同步代理 MAMP SSL 服务器,我无法终生弄清楚为什么它不会流式传输我的 css 更改或重新加载 javascript。如果我不通过 MAMP 使用 https,我当前的配置就可以正常工作。任何帮助或指示将不胜感激。

这是我的 Gulp 配置:

其中端口是 8000(可能并不重要,因为让浏览器同步自动选择它并没有改变任何东西)并且代理是https://mysite.dev

另外,我的 gulp sass 函数管道到browsersync.stream, 澄清。

这是浏览器同步日志的输出,一切似乎都很好。

0 投票
1 回答
1443 浏览

html - 运行 browserSync 的多个实例

Browsersync 仅检测 index.html 并且自动刷新只能应用于此文件。但是我怎样才能将 browsersync 用于 about.html 或 comments.html 等页面????

0 投票
1 回答
393 浏览

wordpress - 我可以让 browsersync 代理不更新特定的 URL 吗?

细节:

我为开发创建虚拟主机http://project.client.dev,然后使用 browsersync 进行实时重新加载等,它在http://localhost:3000. 这会导致页面上的所有 URL 都被写入http://localhost:3000,这在 99% 的情况下正是我想要的,但有时我想链接到那个原始http://project.client.dev路径。

问题:

是否可以让 browsersync不只更新特定的 URL?就像,添加一个类do-not-update或其他东西并让它们保留http://project.client.dev而不是更新到http://localhost:3000

用例:

我建立 WordPress 网站。当我点击网站的前端时,我想要这些http://localhost:300地址,以便实时重新加载。然而,在后端,我不希望这些路径最终出现在数据库中,或者更糟糕的是,在我编辑内容时浏览器同步重新加载我的管理屏幕。通常,我只在前端打开一个选项卡,在后端使用各自的域打开一个选项卡,但我想在页脚添加一个开发中的链接,上面写着“编辑页面 ID 123”并打开当前前端页面向上放在后端进行编辑;问题是,它打开了http://localhost:3000后端的版本,我每次都需要手动更新 URL(只要我记得这样做)。

0 投票
0 回答
104 浏览

gulp - 服务器端的 gulp Live reload

我有一个开发的 gulp 文件,其中包含浏览器同步和实时重新加载。这个 gulp 文件非常适合我的要求。对于基本想法,我的 Apache 服务器中有一个根文件夹,其中有我的项目文件夹。

我正在使用我的 gulp 文件来观看和构建项目文件夹并实时重新加载。目前我正在使用浏览器同步:

“公共”文件夹中所做的每一项更改都会影响实时重新加载。如果我在两个单独的窗口中打开了两个项目并在一个项目上进行了一些更改,则两个窗口都在刷新(实时重新加载)。我不需要这种情况发生。只有一个窗口应该是实时重新加载的。我该怎么做。

原因:

我想为许多用户在服务器端实现这个,我该怎么做?用户的更改不应影响其他用户。

0 投票
0 回答
254 浏览

browser-sync - 浏览器同步 gulp 不会加载带有查询字符串的文件

我现在面临一个奇怪的问题。所以,我正在尝试测试生产构建,并且生成的构建文件包含一个?v=${some random number here}以防止缓存。

但是,浏览器同步不会加载这些文件。

我想出来的方法是因为我总共有 3 个文件、2 个脚本文件和一个样式表。脚本文件和样式表之一生成了查询字符串。

不包含查询字符串的脚本文件被加载。

我的文件夹结构是

这两个 gulp 任务是

我用来生成构建 index.html 的一项替换 html 任务是

并且,最终生成index.html的文件具有所需的文件:

我的浏览器同步配置是

当我启动服务器时,只会scripts.js加载。

谁能解释为什么?

我正在使用最新版本的浏览器同步

0 投票
0 回答
609 浏览

node.js - 如何使用 gulp js 从 URL 中删除端口号

我正在使用 gulpfile.js 来编译开发。我想从 url 中删除端口号,因为我的 url 正在查看 mywebsite.dev:8080

gulpfile.js 代码如下:

0 投票
1 回答
1996 浏览

css - Browsersync 代理站点注入 CSS

我在指向代理 URL 时无法理解 Browsersync serveStatic。从我的阅读看来,我应该能够将 CSS 注入代理网站。在实践中,虽然我似乎无法让它发挥作用。我已经使用 rewriteRules 将代理 URL 上的现有 CSS 文件替换为我的本地 CSS,但如果它不替换文件,我似乎不能只注入纯 CSS。要指定,我的 CSS 根本没有被加载。如果我查看网络流量,我看不到我的样式表正在加载。我误解了 serveStatic 还是我的配置不正确?下面是我的 Gulp 文件的简化摘录。

作为参考,我使用的是 Browsersync V2.8.3。

0 投票
2 回答
5289 浏览

javascript - BrowserSync Gulp 无法在 Chrome 中打开

我尝试在 Chrome 中使用 BrowserSync 和 Gulp 在本地主机上打开我的网站,但它不起作用。默认情况下,它在 Firefox 中打开,一切正常。但是,当我更改 gulpfile.js 中的参数以在 Chrome 中打开网站时 - 我有以下信息:

[Browsersync] 无法打开浏览器(如果您在无头环境中使用 BrowserSync,您可能需要将 open 选项设置为 false)我在 gulpfile.js 中的配置:

我尝试了“chrome”,“chrome-browser”,没有任何反应。我应该怎么做?注意:我有 Ubuntu 17.04,Chrome 是我的默认浏览器。

0 投票
2 回答
1174 浏览

npm - browsersync + gulp 不注入 css - 仅重新加载

我最近开始使用 BrowserSync,我遵循他们的gulp 指南并调整了一些东西来解决我遇到的一些问题,但是现在虽然它工作了,但它似乎每次都重新加载页面而不是注入 CSS。

我的吞咽文件:

请注意我的watch任务,这是我最近所做的更改,因为我遇到了此处指定的问题,我用这个答案解决了它,但是现在虽然它工作正常,但它似乎只是重新加载,而不是注入。

我能做些什么来解决这个问题吗?

编辑:

我刚刚意识到它每次都在重新加载,因为js-watch每次发生更改时我都在运行,甚至是.scss文件,所以我将其更改为:

但是现在它不会在.scss文件更改时注入或重新加载。