gulp-注入：使用 pug 时缺少开始标记的结束标记

Question

我有一个相当具体的问题：我正在尝试使用 Sails.js 和 machinepack-sailsgulpify 构建一个复杂的堆栈。

为了将资产注入我的模板，我使用 gulp-inject 插件，正如机器包所建议的那样。问题是对于 html 和 ejs 之外的任何东西，注入器都不起作用。它根本不会改变任何东西。没有错误，什么都没有。

我的任务是这样的：

gulp.task('sails-linker-gulp:devViews', function() {
    return gulp.src('views/**/*.?(html|ejs|jade|pug|haml|slim|dust)') // Read templates
      .pipe(
        plugins.inject(
          gulp.src(require('../pipeline').jsFilesToInject, {read: false}), // Link the javaScript
          {
            starttag: generateScriptStartTag,
            endtag: generateScriptEndTag,
            ignorePath: '.tmp/public',
            transform: (filepath, file, i, length) => {
              return `script(src="${filepath}")`;
            }
          }
        )
      )
      .pipe(
        plugins.inject(
          gulp.src(require('../pipeline').cssFilesToInject, {read: false}), // Link the styles
          {
            starttag: generateStyleStartTag,
            endtag: generateStyleEndTag,
            ignorePath: '.tmp/public'
          }
        )
      )
      .pipe(
        plugins.inject(
          gulp.src( ['.tmp/public/jst.js'], {read: false}), // Link the JST Templates
          {
            starttag: generateTemplateStartTag,
            endtag: generateTemplateEndTag,
            ignorePath: '.tmp/public'
          }
        )
      )
      .pipe(gulp.dest('views/'))// Write modified files...

不用担心 generateScriptStartTag 和类似的函数，它们只是用于控制，我 1000% 确定它们工作正常，经过大量测试。他们生成的标签有点像这样：

//- SCRIPTS
//- SCRIPTS END

取决于模板语言。

添加自定义转换功能无效。如果我使用 ejs 或 html 或任何类似于 html 语法的东西，它就可以正常工作。

现在，关于 Sails：我不能添加 gulp 任务来在注入之前编译模板，因为 Sails 在开发中根据请求呈现模板，它实际上不会将它们预编译到任何目录中。老实说：我为什么要这样做？注入只是在我的 views 中的 .jade/.pug 文件中添加行，文件已经存在，所以我不明白为什么那里有问题。有人可以建议吗？

更新： 令人沮丧的代码检查显示 'matches' 属性 when 运行 the inject function of has length 0 and when inspecting the content of the stream in node检查员，我没有看到评论，它们被剥离了，尽管它们清楚地存在于文件中。

更新#2： 看来我对ejs的看法是错误的。仅处理 HTML 个文件。当它没有检测到注入评论时它也可以正常工作。但是，如果它执行结束事件，则根本不会为该文件发出任何内容，也不会注入任何内容。对于所有模板引擎都是如此，只有静态 HTML 文件可以正常注入。

更新#3： 又经过 5 小时的调试后，我发现了问题所在，但我对流的理解还不足以让我更接近解决方案。问题是在插件的 inject 函数中有一个循环没有正确退出，虽然它完美地将所需的标签注入到流中，但它然后在同一流上再次运行该循环（带有注入的标签), 并抛出错误。为什么那个错误从未出现在我不知道的任何控制台中，但你去了。有人可以帮忙吗？我对此完全迷失了......这是插件中的错误吗？

Answer 1

我必须自己解决这个问题。这是 gulp-inject 中的错误。该插件生成的用于测试注入标签的正则表达式不匹配整行，它只匹配第一次出现的地方。这意味着如果我的标签设置如下：

//SCRIPTS
//SCRIPTS END

正则表达式将匹配 starttag: //SCRIPTS 两次：

并且结束标签只会匹配一次。这导致了第二个错误循环，其中包含缺少结束标记的错误。

解决方法是避免重复开始标记。

//SCRIPTS
//END SCRIPTS

但这不是解决方案。一种解决方案是更改正则表达式，以便在使用基于缩进的模板语言时，它只允许空格和换行符来匹配标签。像这样的东西会起作用：/\/\/-\s*SCRIPTS(?=\s*\n|$)/ig

不敢相信直到现在还没有人偶然发现这个问题，这似乎是一个更常见的问题...

gulp-注入：使用 pug 时缺少开始标记的结束标记

gulp-inject: missing end tag for start tag when using pug

node.js

sails.js

gulp

gulp-inject

pug