如何在Eleventy(11ty)的include文件中访问JSON数据文件？

1. 核对模板变量与循环语法 #

先确认navigation.html里的循环变量名和default.html完全一致，比如都是navigation，没有拼写错误（比如误写为nav、navItems）。示例正确循环代码：

<ul>
  {%- for item in navigation -%}
    <li><a href="{{ item.url }}">{{ item.text }}</a></li>
  {%- endfor -%}
</ul>

2. 替换为Liquid原生include标签 #

Eleventy的render标签默认会创建隔离的上下文，而Liquid原生的include标签会自动继承当前模板的所有上下文（包括_data下的全局数据）。把default.html中的引入代码改成：

{%- include 'navigation.html' -%}

3. 若保留render，显式传递数据 #

如果需要继续使用render标签（比如利用它的缓存或独立上下文特性），可以在调用时主动传递navigation全局数据：

{%- render 'navigation.html', navigation: navigation -%}

4. 验证数据目录配置 #

检查.eleventy.js中是否修改了默认数据目录，确保没有覆盖_data的配置。如果有类似以下代码，确认路径指向包含navigation.json的目录：

module.exports = function(eleventyConfig) {
  // 若存在此配置，确保路径正确
  // eleventyConfig.setDataDir("_data");
};

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