1

是否可以使用相互扩展的模板？

说，我有这些文件：

base.html：

<html><head>...<head><body>{{{ contents }}}</body></html>

三列.html：

---
layout: base.html
---
<div class="three-cols-row">
   <div class="first col">
      {{> nav}}
   </div>
   <div class="second col">
       {{{ contents }}}
   </div>
   <div class="third col">
      {{> aside}}
   </div>
</div>

somePost.html：

---
layout: threeColumns.html
---

My awesome blogbost

期望的输出：

<html><head>...<head>
    <body>
        <div class="three-cols-row">
           <div class="first col">
              NAV CONTENT
           </div>
            <div class="second col">
               My awesome blogbost
           </div>
           <div class="third col">
              ASIDE CONTENT
           </div>
        </div>
    </body>
</html>

我正在使用金属匠布局。

4

2 回答 2

2

它是，但不完全是你想要的方式。

Metalsmith-layouts 旨在为不原生支持它的语言（如车把）提供模板继承的垫片。为了使这成为可能，它会解析您传递给它的文件，在这种情况下，并在 front-matter 中somePost.html查找密钥。layout之后，它threeColumns.html通过传递somePost.html给threeColumns.html变量来处理选择的布局contents。

此时，文件将通过consolidate使用您选择的引擎呈现。因此layout，特定于metalsmith-layouts不再起作用的密钥，threeColumns.html因为 metalsmith-layouts 不处理它。此时，consolidate 正在处理该文件。

你可以做的是使用原生支持模板继承的语言，比如 swig。然后你可以这样做：

构建.js

/**
 * Dependencies
 */
var filenames = require('metalsmith-filenames');
var layouts = require('metalsmith-layouts');
var metalsmith = require('metalsmith');

/**
 * Build
 */
metalsmith(__dirname)
  .use(filenames()) // Necessary for extends and includes
  .use(layouts('swig'))

  .build(function(err){
    if (err) throw err;
  });

src/somePost.swig

---
layout: threeColumns.swig
---
<p>My awesome blogpost</p>

布局/threeColumns.swig

{% extends "base.swig" %}

{% block body %}
<div class="three-cols-row">
   <div class="first col">
      {% include "nav.swig" %}
   </div>
   <div class="second col">
       {{ contents | safe }}
   </div>
   <div class="third col">
      {% include "aside.swig" %}
   </div>
</div>
{% endblock %}

布局/base.swig

<html>
  <head><head>
  <body>
    {% block body %}{% endblock %}
  </body>
</html>

布局/nav.swig

<nav>Navigation</nav>

布局/aside.swig

<aside>Aside content</aside>

如果您随后从命令行运行node build.js，它会将其构建到一个页面中。

于 2016-03-10T09:58:06.830 回答
0

看起来您正在使用 Handlebars 作为金属匠模板引擎。这意味着您需要注册您的部分。

就像是：

var contents = fs.readFileSync(__dirname + "/templates/partials/" + fileName).toString();
Handlebars.registerPartial(partialTemplateName, contents);

您可能会有多个部分，因此您可以使用它fs.readdirSync('templates/partials');来获取所有文件，然后将其包装在每个文件的循环中。

于 2016-03-10T00:04:19.733 回答