6

I'm working on adding some simple Markdown processing to my Gulp process, but I can't quite get the pieces to work together. I seem to be missing the step between getting the front matter content, and determining which Nunjuck template to apply.

Here's the section in my Gulp file:

gulp.task('pages:md', function() {
  gulp.src('./content/**/*.md')
    .pipe(frontMatter({ // optional configuration
      property: 'frontMatter', // property added to file object
      remove: true // should we remove front-matter header?
    }))
    .pipe(marked({
        // optional : marked options
    }))
    .pipe(nunjucks({
      // ?? Feels like I need to specify which template applies based on the front matter "layout" property?
    }))
    .pipe(gulp.dest('build/'))
});

The markdown file looks like this:

---
title: Title
layout: layout.html
nav_active: home
---

...markdown content...

I feel like it's going the right direction but being able to visualise where that front matter data has gone, and how to expose it to the Nunjucks rendering, is not clear. Any help?

4

2 回答 2

7

你需要gulp-wrap和原始nunjucks的 .

gulp-nunjucks 是一个编译 nunjucks 模板流的工具,但是你需要做的是将你的内容包装在一个 nunjucks 模板中,这就是 gulp-wrap 的用途。

npm install gulp-wrap nunjucks除了其他设置外,请尝试以下设置。

吞咽文件

var gulp = require('gulp')
var wrap = require('gulp-wrap')
var frontMatter = require('gulp-front-matter')
var marked = require('gulp-marked')

var fs = require('fs')

gulp.task('pages:md', function() {
  gulp.src('./content/**/*.md')
    .pipe(frontMatter())
    .pipe(marked())
    .pipe(wrap(function (data) {
      return fs.readFileSync('path/to/layout/' + data.file.frontMatter.layout).toString()
    }, null, {engine: 'nunjucks'}))
    .pipe(gulp.dest('build/'))
});

降价

---
title: Title
layout: layout.nunjucks
nav_active: home
---

...markdown content...

布局.nunjucks

<h1>{{ file.frontMatter.title }}</h1>

<p>{{ contents }}</p>
于 2016-01-06T05:03:47.827 回答
2

你可能想看看插件gulp-ssg。我不知道它的价值,但在这个问题中提到了与你有同样问题的人。

不完全是您正在寻找的东西,但是对于这种工作,我使用metalsmith取得了成功。如果像我一样,您甚至可以将它与 gulp 混合使用,例如,您对 javascripts 资源有更复杂的处理。

于 2015-09-27T19:01:05.823 回答