0

我目前正在使用 Node Patternlab 和 Mustache - 要回答这个问题,您需要使用 Patternlab 的经验(是的,Pattern Lab 使用模板语言来构建利用它打算支持的原子设计原则的分层模式。)。

我已经构建了原子、分子,最后将我的分子构建成头部有机体,一切看起来都很好。但是,我现在想将标题有机体呈现到页面上。

是否需要在页面级别为有机体重新定义 JSON?将我的有机体呈现到页面的语法是什么?

这是 home.mustache 文件的内容,位于以下文件夹结构中:patterns > pages > home.mustache

除其他外,我已经尝试过:

<!DOCTYPE html>
<html lang="en">
<head>
   <meta charset="UTF-8">
   <meta http-equiv="X-UA-Compatible" content="IE=edge">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
   <title>Home</title>
</head>
<body>
<h1> My organisms go here </h1>
  
  {{>organisms-primary-header}}

</body>
</html>

这件事目前是我的基本 html 样板,即使没有 Mustache 语法,当我单击页面时也不会呈现。我会假设我至少会看到 h1 - 但什么也没有出现。

这是我的文件夹结构

模式 > 原子

模式 > 分子

模式 > 有机体

模式 > 页面 > home.mustache

patterns > pages > home.json(标题的 JSON 数据,需要吗?)

4

1 回答 1

1

我已经解决了这个问题。我不会删除我的问题,而是演示如何呈现页面,以防有人遇到类似的困难。

它就像定义您的 JSON 数据并调用您的有机体一样简单。Patternlab 将处理 html 样板文件。

patterns > pages > home.json(我在其中定义我的 JSON 数据)

模式 > 页面 > home.mustache

{{>organisms-primary-header}}

它有效!

于 2021-03-19T08:29:14.693 回答