如何使用gulp-inject在index.html中插入文件的内容?

时间:2016-05-05 21:31:39

标签: javascript node.js gulp gulp-inject

这是我到目前为止所尝试的内容:

val builder = new GensonBuilder().withClassLoader(Array.getClassLoader)
val genson = new ScalaGenson(builder.withBundle(ScalaBundle()).create())
genson.fromJson...

以下是发生的事情:

在:

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但我遇到了插入角色的问题(65279)。我认为这与以下问题有关,但我从来没有能够让胡子为我工作:

How to avoid echoing character 65279 in php? (This question also relates to Javascript xmlhttp.responseText (ajax))

我希望有人可以使用gulp-mustachegulp-inject或任何其他方式向我提供一些建议,以便将文件内容插入另一个文件中。

1 个答案:

答案 0 :(得分:5)

使用custom transform function注入文件的内容:

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('./'));
  });
});