4

Metalsmithをセットアップするためのチュートリアルを試みていて、パート 1 の最後に到達しました。

node.js とモジュールをインストールしました。IDE は、Node.js ツールがインストールされた Visual Studio 2013 です。基本的な構造を入れて、テンプレートでレンダリングする単一のページを取得しようとしています。

手順では、次のファイルに入れるように指示されています。

---
title: Home
template: home.hbt
---

This is your first page

次のようなテンプレートを使用します。

<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8" />
    <title>{{ title }} | Metalsmith Page</title>
</head>
<body>
    <div class="main-wrapper">
        {{{ contents }}}
    </div>
</body>
</html>

チュートリアルでは、html ページにレンダリングする必要があると書かれていますが、得られる結果は次のようなものです。

--- title: Home template: home.hbt --- This is your first page

マークダウンレンダラーを使用すると、

<p>---
title: Home</p>
<h2 id="template-home-hbt">template: home.hbt</h2>
<p>This is your first page</p>

コードをデバッグすると、レンダラーに到達したときにYAML フロントマターメタデータが欠落していることがわかります。プラグインはメタデータを使用してページをレンダリングするため、これは重要なようです。

4

1 に答える 1