DevDocs：一个网页搞定所有 API 文档查询

DevDocs：一个网页搞定所有 API 文档查询

devdocs 在 GitHub 上已经拿到 39,116 Star 了。

freeCodeCamp 维护的这个开源项目，做了一件事：把几十种开发者的 API 文档聚合到一个干净的网页里。搜索快，支持离线，有暗色主题，键盘快捷键也齐全。

1、 这玩意儿是干嘛的

一句话：查 API 文档，不用再到处翻官网了。

开发者平时写代码，最常干的事就是查文档。React 的文档在 react.dev，Python 的在 docs.python.org，Ruby 的在 ruby-doc.org，Vue 的又在另一个地方。每个框架、每个库都有自己的文档站，URL 记不住，排版风格各异，搜索体验参差不齐。

DevDocs 把这些全收拢到一起。打开一个网页，左边选文档集，右边看内容，搜索框里打几个字就能定位到具体的 API。

2、 为什么要用它

用过官方文档站的人都知道那种体验：React 的搜索挺好，但有些库的文档站连搜索都没有，只能靠 Google。不同文档站的排版差距也大，有的字号小得要命，有的代码块没有语法高亮，有的连个目录都没有。

DevDocs 统一了这些。所有文档进来之后，排版一致，搜索响应控制在毫秒级，代码块都有高亮。它用 localStorage 和 Service Worker 做缓存，第一次加载之后，后续打开基本秒开。

离线模式也实用。开启之后，选好的文档集会下载到本地，断网也能查。在飞机上、高铁上、网络不稳定的工位上，这个功能的价值就出来了。

3、 它是怎么做到的

DevDocs 分两部分：一个 Ruby 写的爬虫，一个 JavaScript 写的前端。

爬虫负责从各个官方文档站抓取内容，做一轮清洗：去掉原始页面里的脚本、样式、导航栏，只保留文档正文和元数据。处理完的结果是标准化的 HTML 片段和 JSON 索引文件。

前端是一个单页应用，靠 XHR 加载内容。因为文档已经被爬虫标准化过了，前端只需要处理渲染和搜索。搜索算法不复杂，但在十万级的字符串里也能保持快速响应。

4、 怎么用

最简单的方式：直接访问 devdocs.io。网页版开箱即用，不需要装任何东西。

想自己部署，用 Docker 一行命令：

docker run --name devdocs -d -p 9292:9292 ghcr.io/freecodecamp/devdocs:latest

跑起来之后访问 localhost:9292 就行。

本地安装的话，需要 Ruby 4.0.5 和一个 JavaScript 运行时。装好依赖，下载文档，启动服务：

gem install bundler bundle install bundle exec thor docs:download --default bundle exec rackup

文档的管理用 thor 命令。thor docs:list看所有可用文档，thor docs:download html css下载指定的，thor docs:download --installed更新已安装的。

5、 一些快捷键

DevDocs 在键盘操作上花了心思。按/或Ctrl + K直接聚焦搜索框，方向键浏览搜索结果，回车打开，退格返回上一页。Shift + S切换侧边栏，A打开文档集列表，Esc关闭弹窗。

这些快捷键设计得不复杂，但用熟之后查文档的速度会快很多。

6、 适合谁用

日常写代码需要频繁查 API 文档的开发者。不管你是前端、后端还是全栈，只要你在多个技术栈之间切换，DevDocs 能省下不少在不同文档站之间跳转的时间。

用 AI 编程工具的人也适合。把 DevDocs 的离线文档喂给 LLM，比让模型自己去爬网页靠谱。

在不同文档站之间跳转的时间。

用 AI 编程工具的人也适合。把 DevDocs 的离线文档喂给 LLM，比让模型自己去爬网页靠谱。