如何使用gulp-inject将文件的内容插入到index.html中？

debugcn 发表于 Dev

萨曼莎JT星

到目前为止，这是我尝试过的操作：

gulp.task('watch-index-html', function () {
    gulp.watch(files, function (file) {
        return gulp.src('index/index.html')
            .pipe(inject(gulp.src(['index/base3.html']), {
                starttag: '<!-- inject:base3:html -->'
            }))
            .pipe(print(function (file) {
                return "Processing " + file;
             }))
            .pipe(gulp.dest('./'));
    });
});

这是发生了什么：

前：

<body>
    abcd
    <!-- inject:base3:html -->
    <!-- endinject -->
    efgh

后：

<body>
    abcd
<!-- inject:base3:html -->
<link rel="import" href="/index/base3.html">
<!-- endinject -->
    efgh

我期望看到的是文件的实际内容，而不是该行：

<link rel="import" href="/index/base3.html">

谁能告诉我是否可以通过“插入文件内容”来执行此操作，gulp-inject或者是否还有其他应使用的功能。请注意，过去我曾尝试使用，gulp-mustache但是在插入字符（65279）时遇到了问题。我认为这与以下问题有关，但我从来没有胡须为我工作：

如何避免在PHP中回显字符65279？（此问题也与Javascript xmlhttp.responseText（ajax）有关）

我希望有人可以给我一些建议，可以使用gulp-inject或或以gulp-mustache其他任何方式将文件内容插入另一个文件。

斯文·舍嫩

使用自定义转换函数来注入文件的内容：

gulp.task('watch-index-html', function () {
  gulp.watch(files, function (file) {
    return gulp.src('index/index.html')
      .pipe(inject(gulp.src(['index/base3.html']), {
         starttag: '<!-- inject:base3:html -->',
         transform: function(filepath, file) {
           return file.contents.toString();
         }
      }))
      .pipe(print(function (file) {
        return "Processing " + file;
      }))
     .pipe(gulp.dest('./'));
  });
});

本文收集自互联网，转载请注明来源。

如有侵权，请联系[email protected] 删除。