11ty框架中Last Modified无法作用于自定义变量问题咨询

原因说明 #

11ty 内置的特殊值 Last Modified 默认仅对 Front Matter 中的 date 字段做自动替换，自定义字段（比如你定义的modified）不会触发该逻辑，因此你调用时拿到的是纯字符串而非实际的文件修改时间。

解决方法 #

不需要将 Last Modified 赋值给 date 字段，通过简单配置即可同时保留手动填写的发布时间、自动获取文件修改时间：

• 如果你需要给指定目录下的所有内容添加自动修改时间，在对应目录下新增目录级数据文件即可。比如文章存放在posts目录，就新增posts/posts.11tydata.js，写入如下代码：

const fs = require('fs');
module.exports = {
  eleventyComputed: {
    modified: data => {
      // 优先使用Front Matter中手动填写的modified值，未填写则自动读取文件修改时间
      if (data.modified) return data.modified;
      const fileStats = fs.statSync(data.page.inputPath);
      return fileStats.mtime;
    }
  }
};

如果需要全局所有页面都支持自动获取修改时间，也可以将上述计算属性配置在项目根目录的.eleventy.js全局配置中。

• 原有页面的 Front Matter 保持不变即可，手动填写的date作为发布时间：

---
date: 2021-07-12
---

• 模板中直接调用{{ modified }}即可拿到正确的修改时间，用日期过滤器转为ISO格式后可直接用于application/ld+json结构化数据配置。

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