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

6

解决的关键在于markdown渲染页面开头的三个奇怪的字符



和YAML 前端警告：

UTF-8 字符编码警告

如果您使用 UTF-8 编码，请确保您的文件中不存在 BOM 标头字符，否则 Jekyll 将发生非常非常糟糕的事情。如果您在 Windows 上运行 Jekyll，这一点尤其重要。

查看 Node.js 中加载的缓冲区显示了 utf8 BOM 字符。

一种解决方案是让 IDE 停止将其保存为带有 BOM 的 utf8，但对我来说这不是一个可行的选择。

我创建了一个解决方法，即必须在任何其他 metalsmith 插件之前运行的几行小行。

var stripBom = require('strip-bom');
var front = require('front-matter');
var extend = require('extend');

// **snip**

.use(function __utf8BOM_workaround(files, metalsmith, done)
{
    setImmediate(done);
    Object.keys(files).forEach(function (file)
    {
        var data = files[file];
        var parsed = front(stripBom(data.contents.toString()));
        data = extend({}, data, parsed.attributes);
        data.contents = new Buffer(parsed.body);

        files[file] = data;
    });
})
于 2014-05-29T09:41:42.723 回答