问题标签 [gulp-inject]

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 回答
11461 浏览

gulp - 如何使用 gulp 一步复制和注入 main-bower-files?

在部署我的应用程序时,我想将 bower 依赖项复制到deploy目录中,并将这些文件的链接注入到index.html目录中deploy

由于我无法将它们结合起来,因此每一步都可以完美地工作。

复制文件:

注入文件:

我认为我应该一步一步地做到这一点,以保持依赖文件的正确顺序。

我尝试了这种组合,但没有成功。

0 投票
1 回答
929 浏览

javascript - 如何在 Gulp 中将特定的凉亭组件添加为 IE8 条件块

我有几个凉亭组件,其中我需要一些组件,例如,json3添加到 IE8 条件块中(在构建和服务中),如下所示:respondjses5shim

<!--[if lt IE 9]> <script src="bower_components/json3/json3.js"></script> <![endif]-->

我应该如何继续编写任务?我找不到任何适合gulp-inject这个wiredep问题的例子。请指教

0 投票
2 回答
315 浏览

gulp - Gulp-Inject 位置

如果我想在 diff 中注入 Js 文件。位置,例如<head> herehere </body>。我需要像这里描述的那样为注射设置名称: https ://github.com/klei/gulp-inject#method-2-use-gulp-injects-name-option

我怎样才能修改这个选择器,我不必为每个文件命名。例如,获取所有包含 *_important.js 的文件

有没有更好的方法。例如,喜欢添加 s.th。在 javascript 文件中或将其命名为 orderModule.above.js、googleAnalytics.below.js

0 投票
1 回答
5946 浏览

gulp - 使用 gulp 注入 bower 依赖项 - 相对路径问题

我想用gulp-injectand注入 bower 依赖项main-bower-files。依赖项被拾取,但生成的路径是绝对的。

我得到/www/lib/angular/angular.js而我想要lib/angular/angular.js

.bowerrc

gulpfile.js

0 投票
1 回答
317 浏览

gulp - 使用 gulp-rev 和 gulp-inject 输出的静态脚本:文件未在干净构建中注入

我写的 gulpfile.js 是Common gulpfile.js

在一个build任务中,inject应该将所有静态文件注入到 html 输出中,但它在干净的构建中没有注入任何东西,我必须运行相同的命令(这里是gulp -p project build)两次(gulp -p project build && gulp -p project build)才能成功注入它们。

我试过使用run-sequence,它没有任何帮助。

这是一个错误吗?

谢谢 :)

0 投票
1 回答
817 浏览

angularjs - gulp-inject 未加载所有凉亭组件

我正在使用 yeoman generator-gulp-angular 来搭建我的应用程序。我用 bower 安装了 ng-18next,并且包及其依赖项都正确安装在 bower_components 目录中。但是,当我运行 gulp serve 并查看源代码时,组件没有被注入到页面中,所以我得到了一个模块实例化错误。如果我将 deps 硬编码到页面中,则没有错误。我还尝试了 bower install --save 并将 deps 正确插入到 bower.json 文件中。有任何想法吗?

谢谢。

0 投票
1 回答
129 浏览

javascript - Gulp 运行不正常

我有这个任务:

  • html:

    • 将 .jade 转换为 .html
    • 将 Bower 资源(css、js 和字体)复制到 /dest/vendor 文件夹
    • 将凉亭资源添加到 .html(脚本和链接标签)
    • 将我的 js(来自 /dest/js)和我的 css(来自 /dest/css)添加到 .html(如 prev.)
  • 建造

    • 清理 /dest 文件夹
    • 将我的 js 复制到 /dest/js(只需复制,无需处理)
    • 处理我的 less 文件,并作为 css 移动到 /dest/css

如果我运行gulp build然后gulp html,一切正常。但是,如果添加html作为构建的最后一部分,请不要做更多工作。Jade 被转换为 .html 文件,所有资源(我的和 bower)都被复制到 /dest 文件夹,但是(添加脚本wiredepinject链接标签)似乎什么都不做。

这是(一部分)我的任务:https ://gist.github.com/Falci/f52d4144318c9d5e4c2f

0 投票
1 回答
1508 浏览

node.js - 如何使用 gulp-inject 将修订后的资产正确注入到玉模板中?

我有一个node.js带有express中间件的应用程序。静态页面是使用jade模板引擎制作的,并根据请求呈现res.render("template-name.jade");

SASSjavascript文件被缩小并分别放在/build/js/build/css文件夹中。

此外,使用gulp每个gulp-rev文件都会获得一个附加到其名称的修订字符串,并创建清单文件。以下任务代码用于 javascript 文件:

任务生成manigest文件,如:

类似的任务应该是将 sass 编译为 css。

问题是如何gulp-inject正确使用(在该任务中或作为单独的任务)在每个 .jade 文件中查找和替换仅资产,在该 .jade 文件中定义为带有修订字符串的资产?

我看到了两种主要的解决方法。

方法一

每次都使用相同的翡翠模板,并以某种方式在每个 .jade 文件中定义应注入的文件(基于原始文件,未附加修订字符串,文件名)。然后搜索从上一个任务运行留下的行并将它们替换为具有新修订字符串的新行。

例如,假设我们有 2 个文件。他们每个人都可能使用共同的资产,以及一些特定的资产。

让我们假设这里xxxxxx定义了之前 gulp 任务留下的修订字符串。在我们的例子中,可以更改上面的文件以添加注入注释,例如:

这应该告诉 gulp-inject 应该将特定行更改为包含具有新修订字符串的文件的新行。

方法二

有 2 个模板文件夹,一个包含所有模板源,另一个包含运行注入任务后的模板。Express 应用程序将指向文件夹 2,以便从中获取静态数据。

在第一个文件夹下的所有模板中,只需添加应该注入哪个文件的注释,如下所示:

什么是正确的解决方案?以及如何编写/修改 gulp 任务以正确注入具有修订字符串的资产(基于生成的清单文件或以某种方式没有它)?

谢谢你。

0 投票
1 回答
714 浏览

javascript - 使用“gulp-translate-html”和“gulp-inject”时的 Gulp 管道和缓存问题

我有一个项目,我必须生成翻译后的静态页面。之所以选择使用 gulp,是因为它在缩小资源、监视文件更改和重新编译方面有很大帮助,并且还可以在多个页面中注入 html 模板。

我使用了:
- 'gulp-inject':用于将模板插入最终文件
- 'gulp-translate-html':用于翻译,因为我有 '.json' 字典

所以我有两个问题:

  1. 'gulp-翻译-html'

这使用 json 作为翻译的输入,使用以下代码:

我在“.json”文件上创建了一个手表,修改后,它应该重新应用翻译。但不知何故,它使用旧文件而不是修改后的文件。有解决方法吗?或者我可以用于 json 文件的其他插件?

  1. 'gulp-inject' 在上面的代码示例中,我只翻译了一个文件。但是我需要为几种具有不同目的地的语言这样做,所以我对这些语言使用了一个循环。(对不起代码缩进)

    /li>

在这里,我希望在 'translation' 任务之前运行 'injectContent' 任务,但后者运行得太快了。发生这种情况是因为“injectContent”中没有特定的返回 gulp 回调,对吧?

如何合并结果而不让任务插入?

0 投票
1 回答
1475 浏览

html - 使用 Gulp 修改 html 标签

我们在构建过程中使用 Gulp,它运行良好。我们使用 gulp-inject 将 CSS 和 JS 文件注入到我们的 index.html 中,语法如下:

有没有办法可以在 html 标签中注入属性?在我们的开发环境中,我们希望

在生产环境中,我们希望添加清单标记以指向我们的 appcache 文件: