尤雨溪推荐!VitePress 新插件让文档“读懂”大模型,LLM 友好度拉满!-夜雨聆风

尤雨溪推荐!VitePress 新插件让文档“读懂”大模型,LLM 友好度拉满!

前言

在这个 AI 辅助编程日益普及的时代，如果你的开源项目文档还不能被 ChatGPT、Claude 或 Cursor 完美读取，那你可能就快“掉队”了。

最近，Vue 和 Vite 的作者尤雨溪在社交媒体上亲自转发并点赞了一个 VitePress 插件 —— vitepress-plugin-llms，瞬间引爆了前端圈对于“AI 友好型文档”的讨论。

他在推文中提到的这个插件，致力于解决一个日益凸显的痛点：如何让我们的文档不仅给人看，也能更好地给 AI 看？

为什么 AI 读不懂你的精美网页？

我们习惯的现代技术文档通常是精美的 HTML 页面，包含复杂的导航栏、侧边栏、交互式组件和大量的 CSS 样式。这些对于人类读者来说体验极佳，但对于 LLM（大语言模型）来说，这简直是一场灾难。

当 AI 试图读取你的网页时，它面临着几个问题：

噪音太多：HTML 标签、脚本、样式大量干扰了核心内容的提取。
上下文割裂：文档分散在几十个甚至上百个页面中，AI 很难一次性获取全貌。
Token 浪费：爬虫抓取的内容往往包含大量无关信息，浪费了宝贵的上下文窗口。

解决方案：`vitepress-plugin-llms`

这个插件的核心理念非常简单直接

为 VitePress 站点自动生成一套遵循 llmstxt.org 标准的、专门给 AI 看的“纯净版”文档。

它能够在构建时自动生成以下关键文件：

/llms.txt：这就好比是给 AI 看的 地图 或 索引。它是一个标准化的 Markdown 文件，简要介绍了项目背景，并列出了所有文档页面的精简链接和描述。
/llms-full.txt（杀手锏功能）：它将你整个站点的文档内容合并成了一个巨大的、纯文本的 Markdown 文件。当你希望 AI IDE 工具“学习”你的整个库时，直接把这个文件喂给它，它就能一次性获得完整的上下文，而不需要再去一个个页面抓取。

核心功能

除了生成纯文本，这个插件还引入了非常有意思的“双面内容”控制功能，让你能够像做“Prompt Engineering”一样编写文档：

`<llm-only>` 标签

你可以写一段话，只给 AI 看，不给人类看。

应用场景：给 AI 的特定指令，比如提供更详细的代码上下文，或者强调某些版本差异，而这些细节对于人类读者来说可能太啰嗦。

`<llm-exclude>` 标签

你可以写一段内容，只给人类看，不给 AI 看。

应用场景：移除那些充满广告、赞助商列表、复杂的交互式 Demo 或纯粹的视觉装饰元素，让 AI 拿到的内容更加干练，节省 Token。

如何使用？

如果你的项目也是基于 VitePress 构建的，使用它几乎是零门槛的。

1. 安装插件

npm install vitepress-plugin-llms

2. 配置 VitePress

在你的 .vitepress/config.ts 中引入并注册即可：

import { defineConfig } from'vitepress'import llms from'vitepress-plugin-llms'exportdefault defineConfig({// ... 其他配置  vite: {    plugins: [      llms({// 可以在这里配置选项，比如生成的 URL 前缀等        siteUrl: 'https://your-documentation-site.com'      })    ]  }})

构建完成后，你的站点根目录下就会自动出现 llms.txt 和 llms-full.txt。

结语

尤雨溪的推荐往往代表着前端开发体验的风向标。随着 AI 编程工具的深度介入，文档的可被机器阅读性将变得和“人类可读性”一样重要。

如果你的开源项目还没有适配 LLM，不妨试试这个插件，让你的文档在 AI 时代也能“丝般顺滑”地被理解和引用。

感谢阅读！顺手点个“赞”和“推荐”呗

关注【谦君玩码】并设为星标

不错过每一篇更新

尤雨溪推荐!VitePress 新插件让文档“读懂”大模型,LLM 友好度拉满!

前言

为什么 AI 读不懂你的精美网页？

解决方案：`vitepress-plugin-llms`