.hbs 文件的 YAML 前端未处理 Lodash 模板/变量

Question

我一直在与 Assemble 团队就这个问题进行反复沟通，他们认为这似乎是实施问题而不是错误。

基本上，我有一个 assemble 设置（不是 grunt-assemble），我试图通过 assembles YAML front-matter 将 YAML 文件中的一些数据拉入车把模板，然后将其传递给部分渲染。

我在记录汇编数据上下文时得到的是，前面的变量是未定义的。

与其浏览我所做的一切并在此处编写 sn-ps 代码，您可以在此线程中查看对话历史记录、代码 sn-ps 以及迄今为止尝试过的所有事情：https://github.com/assemble/assemble/issues/758

我还在我的 github 上创建了一个公共演示存储库，供任何想要将其拉下/分叉以进行进一步调查的人使用。

https://github.com/tgdev/assemble-yaml-demo

为什么前面的lodash模板返回的是undefined，而不是外部YAML文件的内容？

2016 年 11 月 9 日更新：使用 json 似乎可以正常工作

将 yml 文件中的数据更改为 json（扩展名为 .json）会按预期使用 tools/templates.js 中的前端中间件呈现，因此 assemble 和/或 handlebars 似乎在解析 yml 文件时出现问题。

这是我正在测试的主要 yml 文件的副本：

content: >
  <h2>Page sub heading</h2>
  <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
  <p>
  <img src="http://placehold.it/1170x658" alt="" class="align-left" />
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
  </p>
  <p><img src="http://placehold.it/1170x658" alt="" class="align-right" />
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
  </p>

所以现在，我的问题是，为什么车把模板的 assemble front-matter 中的 lodash 模板不能解析 yaml 文件（未在日志中定义）？

Answer 1

好吧，我终于明白了。

问题是这样的......

Assemble 不支持外部 yaml 字体文件，所以我需要在中间件之前使用这段 sn-p 代码。

import yaml from 'js-yaml';

templates.dataLoader('yml', function(str) {
  return yaml.safeLoad(str);
});

然后扩展器中间件通过 lodash 模板从前端加载 yaml 文件内容，将其添加到数据上下文中。

所以这里是整个 assemble 构建任务文件供参考（我希望它对未来的人有所帮助）。

import assemble from 'assemble';
import expander from 'expander';
import merge from 'lodash.merge';
import yaml from 'js-yaml';
import through from 'through2';
import plumber from 'gulp-plumber';
import { projectName, templatesPathConfig as path } from '../project.config';

export default function templates() {

  // Create assemble instance
  let templates = assemble();

  function expand(data) {
      // `data` is front-matter
      const ctx = merge({}, templates.cache.data, data);
      return expander.process(ctx, data);
  }

  // @reference
  // https://github.com/node-base/base-data#dataloader
  //
  // @notes
  // Loading yaml files is not built in. Assemble uses
  // base-data now. You can add yaml loading by using
  // a custom dataLoader.
  templates.dataLoader('yml', function(str) {
      return yaml.safeLoad(str);
  });

  templates.data(path.data); // path.data = ./src/templates/data/**/*.yml

  templates.preRender(/\.(hbs|html)$/, function (view, next) {
      view.data = expand(view.data);
      next();
  });

  templates.task('preload', function(cb) {

      templates.partials(path.partials);
      templates.layouts(path.layouts);

      // Register helpers
      templates.helpers(path.helpers);

      // Add master pages and listing page
      templates.pages(path.pages);
      templates.pages(path.referencePages);
      templates.pages(path.index);

      // Add custom data
      templates.data({
          projectName: projectName
      });

      cb();

  });

  // Assemble task to build template files
  templates.task('build', ['preload'], () => {

      // Render out the template files to 'dist'
      return templates.toStream('pages')
          .pipe(plumber({
              errorHandler: err => {
                  log.error(`${err.message}.`);
              }
          }))
          .pipe(templates.renderFile())
          .pipe(plumber.stop())
          .pipe(renameExt())
          .pipe(templates.dest('dist'));
  });

  // Run the Assemble build method
  templates.build('build');
}

// Change the file extension through node stream
function renameExt() {
    return through.obj( (file, enc, next) => {
        file.extname = '.html';
        next(null, file);
    });
}