问题标签 [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 投票
0 回答
346 浏览

javascript - Browser-Sync - 所有事件 Hook - Gulp

最近我发现了浏览器同步。现在我要编写的应用程序需要一种谷歌地图功能。我注意到本机浏览器同步只支持“滚动、点击和表单”。我需要挂钩所有事件,或者至少在与地图进行平移/交互时挂钩,以便它同步跨浏览器。

我发现了一个博客讨论,结论是已经解决了这个问题,并链接到 browser-sync-client 项目https://github.com/BrowserSync/browser-sync-client

由于没有文档,只有一个小例子。谁能告诉我如何在 gulp 设置中实现它?

我尝试执行以下操作,但没有任何运气:

0 投票
0 回答
355 浏览

javascript - Gulp / Browsersync 不显示图像

浏览器不显示图像。如果我查看代码并在新选项卡中打开图像,则会出现以下消息:Cannot GET /app/img/b1.jpg

提前致谢!

0 投票
1 回答
1205 浏览

javascript - Gulp 4 browserSync 与 Pug 和 Parceljs 任务并行并行

所以基本上我要做的是让浏览器在使用browserSync的文件发生变化时刷新,编译Pug模板,然后Parceljs进行捆绑。而Gulp就是要留意变化。

总体目标是静态网站/页面。

问题

如果包裹构建失败。browserSync 退出。手表停止。

操作系统:Windows 10

谢谢!!

Gulpfile.js 内容:

0 投票
0 回答
233 浏览

javascript - Browsersync 仅适用于第二次保存

我之前从未遇到过这个问题,因为我使用的是单页网站。但是现在我有几个页面,当我在“build”文件夹中创建第三个文件时,browsersync 开始无法按预期工作。

基本上,browsersync 现在只在第二次保存时对浏览器进行更改。您可以在视频中看到此行为:https ://youtu.be/lNFEDZMBiQY

这是我的 gulp 设置:

也许,这个设置有错误?我该如何解决这个问题?

0 投票
1 回答
36 浏览

gulp - 为什么我的 gulp+browser-sync 设置不起作用?

用了很久,我的设置在这里,但是今天我尝试启动一个新项目,并再次使用它,但它没有按预期工作。

这是我启动命令时的结果gulp

我的 package.json 文件和以前一样,但是用以前下载的 node 模块,它可以工作,用新下载的 node 模块,结果如上。

为什么?帮助

0 投票
1 回答
1598 浏览

sass - Gulp 浏览器同步重新加载而不是注入 css

我可以了解为什么我在 chrome 控制台中收到此消息,它似乎可以防止 css 代码注入。

Browsersync 重新加载所有样式表,因为路径 'html\css\theme.css' 不匹配任何特定的。

我怀疑这是我遇到的路径问题,但我似乎无法弄清楚。我试图尽可能地脱掉衣服。

这是我的文件夹结构:

这是我的代码:

0 投票
2 回答
633 浏览

gulp - Browsersync 不会在 wamp 上刷新

几个小时以来我一直在战斗,我有一个小问题。我想使用 gulp 来观看 scss 文件,将它们转换为 css 然后重新加载浏览器。

它一直有效,直到重新加载浏览器。所以 sass 正在使用 gulp 而不是 Browsersync。这是我的 gulpfile.js,也许有人可以帮忙?

Ps:我正在使用 CAKEPHP 3。

0 投票
2 回答
901 浏览

wordpress - Gulp 浏览器同步问题:http://192.168.1.104:8080/ 不工作

我是 WordPress 的初学者。我正在学习使用下划线构建 WordPress 主题。在命令行中输入“gulp”后,浏览器会打开http://192.168.1.104:8080/ 。它继续加载,但最终出现此错误:

这是我的 gulp.js 文件:

当我通过 NetBeans 进入“gulp.dev”目录的“node_modules”时,我注意到“browser-sync”、“gulp”和“gulp-saas”文件夹中有一些错误。

你可以在这里找到整个 gulp.dev 目录: https ://drive.google.com/open?id=1HaFcW0dCMIH3t8Dyg8f8hcQwxfux0GnT

我应该附上整个练习文件,包括 WordPress 文件吗?

0 投票
0 回答
303 浏览

browser-sync - node 8.9.4 升级后 browserSync.reload() 停止工作

以下设置的工作方式如下:

  1. 我改变一个文件
  2. gulp 任务开始,最终改变/file/to/watch.js
  3. nodemon 重新启动我的快速服务器
  4. browserSync.reload() 被调用
  5. 浏览器重新加载

自从更新到节点 8.9.4(我认为那是它发生的时候),这不再有效。步骤 1-4 仍然可以正常进行。但不是第 5 步。我仍然看到“browserSync.reload!!!” 登录我的控制台,但浏览器永远不会重新加载。我已经尝试过浏览 browserSync 源代码,但在我进入标记为“本机代码”的函数之前我并没有走得太远。

任何想法如何让我的浏览器再次重新加载?

更新:我发现问题在于没有注入浏览器同步脚本标签。我还发现,如果我将open选项从更改falsetrue,那么它可以工作。不过,我更喜欢将其设置为false,并且它曾经以这种方式工作。不确定发生了什么变化。

0 投票
2 回答
870 浏览

gulp - 使用 SASS、BrowserSync、Uglify 和 Nodemon 的 Express 的 Gulp 工作流

我面临的问题:

  • 浏览器不反映 .scss 或 .js 中的实时更改
  • 我不明白我们是否必须从 gulp.task() 返回流,我访问了一些网站并观看了一些讲座,其中一些使用了 return,有些没有。
  • 看不懂gulpfile的执行流程(先运行哪个语句,再运行哪个等等)

这是我当前的代码gulpfile.js

您可以在https://github.com/DivyanshBatham/GulpWorkflow查看项目结构