尧图网站建设 
如何利用本地 Git 历史为 Fumadocs MDX 文档输出最后修改时间【免费下载链接】fumadocsThe beautiful flexible React.js docs framework.项目地址: https://gitcode.com/GitHub_Trending/fu/fumadocs如果你在用 Fumadocsfumadocs搭建文档站想给每个页面展示最后更新时间fumadocs-mdx提供了一个lastModified插件它在构建时读取你本地的 Git 提交历史为每个 MDX 文档计算并导出lastModified属性类型为Date之后就能在页面上展示出来。整个过程依赖一个前提你的机器上安装了 Git且仓库不是浅克隆shallow clone因为插件解析时间时会执行本地git log。在 source.config.ts 中启用插件在 MDX 处理器配置文件Fumadocs 项目里是source.config.ts中引入插件并加入plugins数组import { defineConfig } from fumadocs-mdx/config; import lastModified from fumadocs-mdx/plugins/last-modified; export default defineConfig({ plugins: [lastModified()], });本仓库的 source.config.ts 就是这样配置的同时使用了satteri编译器和jsonSchema插件。这个插件本质上是一个快捷方式它会为配置中每个文档集合collection设置lastModified选项但已经自行设置了lastModified的集合会被原样保留、不做覆盖见 插件实现。可选自定义时间来源插件接受一个versionControl参数默认值是git见 LastModifiedPluginOptions保持默认git直接从本地 Git 历史读取。文档特别提醒如果你使用 Vercel 部署需要把环境变量VERCEL_DEEP_CLONE设置为true避免浅克隆导致没有完整历史。传入一个函数签名为(filePath: string) PromiseDate | null | undefined由你自己决定如何为某个文件路径返回最后修改时间例如调用 GitHub API 或 CMS返回null/undefined表示未知。插件还支持filter参数按集合名称筛选哪些集合应用该配置。了解 Git 时间是如何解析的默认路径下插件按集合的内容目录解析时间实现见 loaders/mdx/last-modified.ts先执行git rev-parse --show-toplevel找到仓库根目录再执行git -c core.quotepathoff log --formatcommit:%aI --name-only -- 内容目录把提交范围限定在文档目录内不做限定的话会为每个进程缓冲整个仓库历史按新提交在前的顺序处理为每个文件保留第一次出现的提交日期即该文件最近一次被修改的时间。由此可以得到两条使用上的边界文件必须已提交到 Git未提交的文件查不到时间lastModified会是undefined仓库若是浅克隆历史不完整解析出的时间可能不准或查不到。在代码中读取 lastModified 属性启用插件并重新生成/构建后每个文档都会导出lastModified属性。按 Last Modified Time 文档通过 source 读取import { source } from /lib/source; const page source.getPage([...]); console.log(page.data.lastModified); // 或惰性加载 const { lastModified } await page.data.load(); console.log(lastModified);这里[...]替换为你要查询的文档 slug 路径。console.log的输出是一个Date这就是验证插件生效的方式如果打印出Date对象而不是undefined说明 Git 历史解析成功。在页面上展示时间Fumadocs UI 的DocsPage布局组件提供了PageLastUpdate见 Page 布局文档的 Last Updated Time 一节import { DocsPage, PageLastUpdate } from fumadocs-ui/layouts/layout/page; const lastModifiedTime page.data.lastModified; DocsPage {/* Other content */} {lastModifiedTime PageLastUpdate date{lastModifiedTime} /} /DocsPage;注意两点导入路径中的layout占位符要替换为你实际使用的布局名如default文档原文就用这个形式表示按你的布局选择展示前用lastModifiedTime ...做了判空——因为未提交的文件取不到时间属性可能是undefined不能假设它一定有值。限制与排查Git 未安装或仓库是浅克隆文档中明确以 warning 提示默认依赖本地 Git 历史浅克隆下git log拿不到完整提交记录时间会缺失或错误。文件未提交解析函数在未知例如文件没提交时返回null/undefined页面上对应的时间区域就不会渲染。自行设置过lastModified的集合插件不会覆盖它们如果你自定义了时间来源以集合自己的配置为准。Vercel 部署必须设置VERCEL_DEEP_CLONEtrue否则构建环境是浅克隆本地 Git 历史不完整。完成以上配置后验证路径就是文档已提交 → 重新构建 →page.data.lastModified能取到Date→ 页面通过PageLastUpdate显示出来。如果你不需要 Git 而是想按 GitHub 仓库在线查询文档还介绍了另一个方向——GitHub API 方式见 Page 布局文档 中的getGithubLastEdit用法但那属于不同的实现路径与本文的本地 Git 历史方案二选一即可。【免费下载链接】fumadocsThe beautiful flexible React.js docs framework.项目地址: https://gitcode.com/GitHub_Trending/fu/fumadocs创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考 如何利用本地 Git 历史为 Fumadocs MDX 文档输出最后修改时间？
如何利用本地 Git 历史为 Fumadocs MDX 文档输出最后修改时间【免费下载链接】fumadocsThe beautiful flexible React.js docs framework.项目地址: https://gitcode.com/GitHub_Trending/fu/fumadocs如果你在用 Fumadocsfumadocs搭建文档站想给每个页面展示最后更新时间fumadocs-mdx提供了一个lastModified插件它在构建时读取你本地的 Git 提交历史为每个 MDX 文档计算并导出lastModified属性类型为Date之后就能在页面上展示出来。整个过程依赖一个前提你的机器上安装了 Git且仓库不是浅克隆shallow clone因为插件解析时间时会执行本地git log。在 source.config.ts 中启用插件在 MDX 处理器配置文件Fumadocs 项目里是source.config.ts中引入插件并加入plugins数组import { defineConfig } from fumadocs-mdx/config; import lastModified from fumadocs-mdx/plugins/last-modified; export default defineConfig({ plugins: [lastModified()], });本仓库的 source.config.ts 就是这样配置的同时使用了satteri编译器和jsonSchema插件。这个插件本质上是一个快捷方式它会为配置中每个文档集合collection设置lastModified选项但已经自行设置了lastModified的集合会被原样保留、不做覆盖见 插件实现。可选自定义时间来源插件接受一个versionControl参数默认值是git见 LastModifiedPluginOptions保持默认git直接从本地 Git 历史读取。文档特别提醒如果你使用 Vercel 部署需要把环境变量VERCEL_DEEP_CLONE设置为true避免浅克隆导致没有完整历史。传入一个函数签名为(filePath: string) PromiseDate | null | undefined由你自己决定如何为某个文件路径返回最后修改时间例如调用 GitHub API 或 CMS返回null/undefined表示未知。插件还支持filter参数按集合名称筛选哪些集合应用该配置。了解 Git 时间是如何解析的默认路径下插件按集合的内容目录解析时间实现见 loaders/mdx/last-modified.ts先执行git rev-parse --show-toplevel找到仓库根目录再执行git -c core.quotepathoff log --formatcommit:%aI --name-only -- 内容目录把提交范围限定在文档目录内不做限定的话会为每个进程缓冲整个仓库历史按新提交在前的顺序处理为每个文件保留第一次出现的提交日期即该文件最近一次被修改的时间。由此可以得到两条使用上的边界文件必须已提交到 Git未提交的文件查不到时间lastModified会是undefined仓库若是浅克隆历史不完整解析出的时间可能不准或查不到。在代码中读取 lastModified 属性启用插件并重新生成/构建后每个文档都会导出lastModified属性。按 Last Modified Time 文档通过 source 读取import { source } from /lib/source; const page source.getPage([...]); console.log(page.data.lastModified); // 或惰性加载 const { lastModified } await page.data.load(); console.log(lastModified);这里[...]替换为你要查询的文档 slug 路径。console.log的输出是一个Date这就是验证插件生效的方式如果打印出Date对象而不是undefined说明 Git 历史解析成功。在页面上展示时间Fumadocs UI 的DocsPage布局组件提供了PageLastUpdate见 Page 布局文档的 Last Updated Time 一节import { DocsPage, PageLastUpdate } from fumadocs-ui/layouts/layout/page; const lastModifiedTime page.data.lastModified; DocsPage {/* Other content */} {lastModifiedTime PageLastUpdate date{lastModifiedTime} /} /DocsPage;注意两点导入路径中的layout占位符要替换为你实际使用的布局名如default文档原文就用这个形式表示按你的布局选择展示前用lastModifiedTime ...做了判空——因为未提交的文件取不到时间属性可能是undefined不能假设它一定有值。限制与排查Git 未安装或仓库是浅克隆文档中明确以 warning 提示默认依赖本地 Git 历史浅克隆下git log拿不到完整提交记录时间会缺失或错误。文件未提交解析函数在未知例如文件没提交时返回null/undefined页面上对应的时间区域就不会渲染。自行设置过lastModified的集合插件不会覆盖它们如果你自定义了时间来源以集合自己的配置为准。Vercel 部署必须设置VERCEL_DEEP_CLONEtrue否则构建环境是浅克隆本地 Git 历史不完整。完成以上配置后验证路径就是文档已提交 → 重新构建 →page.data.lastModified能取到Date→ 页面通过PageLastUpdate显示出来。如果你不需要 Git 而是想按 GitHub 仓库在线查询文档还介绍了另一个方向——GitHub API 方式见 Page 布局文档 中的getGithubLastEdit用法但那属于不同的实现路径与本文的本地 Git 历史方案二选一即可。【免费下载链接】fumadocsThe beautiful flexible React.js docs framework.项目地址: https://gitcode.com/GitHub_Trending/fu/fumadocs创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考