Question

我这里有一个名为tpage.hbs的把手模板：

<!DOCTYPE html>
<html lang="en">
<head>
  <title>Title</title>
  {{> head}}
</head>
<body>
  {{> home-header}}
  {{{ mdcontents }}}
</body>
</html>

head和home-header是局部的。

我有一个Markdown文件文件夹，我想基于此模板制作HTML页面，在模板中mdcontents的位置添加.md文件。

我有以下Gulpfile：

var gulp = require('gulp');

var handlebars = require('gulp-compile-handlebars');
var HB = require('Handlebars'); // I know I don't need two Handlebars imports, I'm just trying different things at this point
var uglify = require('gulp-uglify');
var markdown = require('gulp-markdown');
var tap = require('gulp-tap');

// ...

gulp.task('markhb', function() {
  return gulp.src('./app/templates/tpage.hbs')
    .pipe(handlebars({}, {
      ignorePartials: false,
      batch: ['./app/templates/partials'] /* my partials directory */
    }))
    .pipe(tap(function(file) {
      var template = HB.compile(file.contents.toString());
      console.log(file.contents.toString());

      return gulp.src('./app/content/mdpages/**.md')
        .pipe(markdown())
        .pipe(tap(function(file) {
          var data = {
            mdcontents: file.contents.toString()
          };

          var html = template(data);

          file.contents = new Buffer(html, 'utf-8'); // Buffer() is deprecated, I'll fix that later
        }))
        .pipe(rename({
          extname: '.html'
        }))
        .pipe(gulp.dest('build/pages'));
    }));
});

所以，我的问题是，如果我保留第一个pipe调用，它会很好地加载部分内容，但会完全忽略并剥离mdcontents。但是，如果我删除了第一个pipe调用，它将使markdown正常，但会去除部分内容。我也不喜欢现在使用两个Handlebars库，但是在这一点上，我只想要一个工作模板，然后再进行清理。我需要添加，删除或更改以使局部图像和降价标记都可以呈现吗？

Answer 1

使用类似https://github.com/helpers/helper-markdown这样的Handlebars markdown中间件。

然后，我们的想法是使用带有辅助标记降级功能的Handlebars作为过滤器来包含文件，而不是让gulp为您处理。

基于带有Gulp的Handlebars模板编译局部和markdown

1 个答案: