如何在Eleventy模板中正确插入HTML代码块

问题背景 #

将Python搭建的网站迁移至Eleventy过程中，参考入门教程与官方布局文档操作，尝试通过Nunjucks front matter配置，将存放在need3.njk中的HTML代码块插入test.njk模板，编写的模板初始代码如下：

---
title: hi
question: there
need3: need3.njk
---
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />

配置完成后页面没有插入实际HTML内容，仅输出了need3.njk文件名，渲染效果如下：

问题原因 #

front matter中need3: need3.njk只是给need3变量赋值了一个字符串类型的文件名，如果在模板中直接用{{ need3 }}输出，只会打印变量的字符串值，不会自动加载、渲染对应路径的模板文件。

解决方法 #

根据使用场景选对应写法即可：

• 固定插入局部片段
  如果不需要动态切换插入的模板内容，不需要在front matter中做额外配置，直接在test.njk需要插入内容的位置，用Nunjucks的include语法引入片段：

  {% include "need3.njk" %}
  

  注意：Eleventy默认从根目录的_includes文件夹查找被引入的模板，可以把need3.njk移到该目录下，也可以写相对于当前test.njk的准确文件路径。
• front matter动态指定插入模板
  如果需要通过front matter变量动态控制插入的模板文件，保留原有front matter的变量定义即可，引入位置不要直接输出变量，把变量传入include标签：

  {# 变量名不要加引号，加引号会被识别为固定字符串值 #}
  {% include need3 %}
  

  该写法会自动读取need3变量存储的文件路径，加载并渲染对应模板内容插入到当前位置。

内容的提问来源于stack exchange，提问作者user1592380