如何在通过 Assemble 0.6.0 运行它们之前合并两个 Handlebars 部分？答案

【问题标题】：How can I merge two Handlebars partials before running them through Assemble 0.6.0?如何在通过 Assemble 0.6.0 运行它们之前合并两个 Handlebars 部分？
【发布时间】：2015-05-13 15:24:50
【问题描述】：

我有两个 .hbs 文件。一个包含一个基本按钮，另一个包含一个使用该 {{basic-button}} 的按钮栏。我想将第一个 .hbs 拉入第二个，然后让 Assemble 将其渲染为文件。

我认为这就像将基本按钮注册为部分按钮并将其传递到按钮栏页面一样简单。但看起来我需要遍历我的 .hbs 文件，渲染它们，然后让 assemble 做它的事情。

有没有可以在 Assemble 中使用的对应的 handlebars.registerpartials

【问题讨论】：

标签： handlebars.js assemble

【解决方案1】：

您可以使用.partials 方法注册部分...

assemble.partials(['partials/*.hbs']);

然后你可以使用那些带有普通句柄语法的部分（使用文件名作为部分名称）

{{> basic-button}}

如果这不是您想要做的，您能否发布一个我可以查看的存储库？

编辑

基于 cmets：您可以在局部（和其他模板类型）中使用布局

元素部分

---
layout: button-bar
---
{{> basic-button }}

按钮栏

{% body %}

但我认为这不是您想要完成的，因为您可能希望按钮栏中有多个“基本按钮”部分。

另一种选择是在页面中使用 front-matter 来指定按钮列表并将其作为局部上下文传递给局部：

page.hbs

---
buttons:
 - "basic-button"
 - "advanced-button"
 - "menu-button"
---
{{> button-bar buttons}}

然后在button-bar 中，您可以使用我们内置的partial 助手来动态包含列表中的部分：

<ul class="btn-bar">
{{#each this}}
  <li class="btn">{{partial this}}</li>
{{/each}}
</ul>

希望这会有所帮助。

【讨论】：

我有两个级别的代码片段。简单而复杂。在我用 assemble 包装任何东西之前，我希望复杂页面（将简单片段作为部分引用）进行编译。因此，在将其移交给 Assemble 之前进行“pre-hbs”编译。我可以使用它：gulp.task('pre', function () { return gulp .src('./src/blocks/header-bar/*.hbs') .pipe(hb({ partials: './src/elements/**/*.hbs', })) .pipe(gulp.dest('./src/hbs/')); }); ，但我认为必须有一种方法可以使用 Assemble 来实现。遗憾的是，我无法分享回购。
抱歉，我错过了您对此的评论……在 assemble 0.6.0+ 中，我们支持所有模板类型（包括部分）的布局。我会用一个例子来更新答案，因为它不适合评论。