向 Fractal 添加车把布局助手答案

【问题标题】：Adding handlebars layouts helper to Fractal向 Fractal 添加车把布局助手
【发布时间】：2017-09-21 23:50:17
【问题描述】：

我正在尝试将车把布局助手 (https://github.com/shannonmoeller/handlebars-layouts) 添加到 Fractal (http://fractal.build)，但无法正常工作。

我已按照位于 fractal.build/guide 的指南将其添加到 fractal.js。

我已经添加了所需的包（@frctl/handlebars、handlebars-helper 和handlebars-layouts）。

我有一个名为“grid.hbs”的文件，想在“grid-full-width.hbs”中扩展它。

fractal.js

const instance = fractal.components.engine();

// Using handlebars-layouts (https://www.npmjs.com/package/handlebars-layouts)

const layouts = require('handlebars-layouts');
layouts.register(instance.handlebars);

// Using handlebars-helpers (https://github.com/assemble/handlebars-helpers)

const helpers = require('handlebars-helpers');
helpers({
    handlebars: instance.handlebars
});

grid.hbs

<div class="grid">
  {{#block "content"}}
    Fallback content
  {{/block}}
</div>

grid-full-width.hbs

{{#extend "grid"}}
  {{#content "content"}}
    New content
  {{/content}}
{{/extend}}

输出

[object Object]

有人知道我做错了什么吗？

【问题讨论】：

标签： handlebars.js handlebarshelper

【解决方案1】：

找到解决办法：

/*
 * Add layouts helper
 */
const hbs = require('@frctl/handlebars');

const instance = fractal.components.engine(hbs);

// Using handlebars-layouts (https://www.npmjs.com/package/handlebars-layouts)

const layouts = require('handlebars-layouts');
layouts.register(instance.handlebars);

更多信息在这里：https://github.com/frctl/fractal/issues/355

【讨论】：