2016-05-05 8 views
2

ここで私はこれまで試してみましたものです:gulp-injectを使用してindex.htmlにファイルの内容を挿入するにはどうしたらいいですか?

前:

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

後:

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 --> 
<link rel="import" href="/index/base3.html"> 
<!-- endinject --> 
    efgh 

私が見に期待何ましたファイルの実際の内容ではなく、行:

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

gulp-injectで「ファイルの内容を挿入する」ことができるのか、他に何か使用すべきことがあるのか​​誰にでも教えてください。過去に私はgulp-mustacheを使ってみましたが、文字を挿入したように見える問題がありました(65279)。私は、これは、次の質問に関連したものだったと仮定したが、私は口ひげが私のために仕事を得ることができなかった:

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

私は誰かが私にgulp-inject持つかgulp-mustacheや他とのいずれかのいくつかのアドバイスを与えることができることを望みますファイルの内容を別のファイルに挿入する方法。

答えて

4

ファイルの内容を注入する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('./')); 
    }); 
}); 
関連する問題