0

我正在使用 Metalsmith 和 Nunjucks 创建一个静态网站。

我创建一个类似博客的网站没有问题，这意味着创建一个布局，我可以使用 metalsmith-layout 插件来包装一些降价内容。

但我想创建一些视图：

  • 使用布局（使用 front-matter 或 extends 方法）
  • 使用一些手工制作的组件/局部/宏

例如，一个 index.njk ：

{% extends "layouts/base.njk" %}

{% block content %}

Hello World!

{% include components/test1.njk %}

{% include components/test2.njk %}

{% include components/test3.njk %}

{% endblock %}

我尝试使用 metalmisth-in-place 插件：

.use(inplace({
    engineOptions: {
        path: __dirname + '/src/templating'
    }
})

但我有一个错误：The Transform "nunjucks" does not support rendering synchronously

似乎 inplace() 无法正确呈现包含...

任何想法 ？

4

1 回答 1

0

好的，我对金属匠的松弛有一些很好的答案和解释。

首先，文件夹结构应该是这样的：

layouts/
    base.njk
components/
    test.njk
partials/
    head.njk
src/
    index.njk

原因是该src文件夹应该只收集主要内容，所有 nunjucks 文件都只是添加到此内容中。

那么，有了这个配置，一个简单.use(inplace())的就够了。如果directory目录不同于./layouts.

有了这个设置，这个 index.njk 工作正常：

{% extends "./layouts/base.njk" %}

{% block content %}

Hello World!
{% include './components/test.njk' %}

{% endblock %}

base.njk布局为：

<!doctype html>
<html class="" lang="">

  {% include '../partials/head.njk' %}

  <body>

    {% block content %}{% endblock %}

  </body>

</html>

但是要小心，正如我被告知的那样：

  • 文件src夹中的文件在 metalsmith 文件对象中进行转换，因此从那里读取，即在内存中而不是直接从磁盘中读取。这意味着 nunjucks 无法解析此文件夹内的相对路径，这就是 index.njk 中的包含具有绝对路径的原因：'./components/test.njk'
  • 文件夹外的src文件不会在 metalsmith 文件对象中转换，因此直接从磁盘读取。在这种情况下，nunjucks 可以解析相对路径，这就是 include 有这样一个路径的原因'../partials/head.njk'

希望我解释清楚并理解它^^

非常感谢“ismay”花一些时间来帮助我解决 Metalsmith 的问题。

于 2018-04-12T15:59:05.163 回答