用 TRAE SOLO 从零搭了一个 GitBook 风格文档站，全程只动嘴不动手

SOLO挑战赛专区
1

前言

最近参加了 TRAE × 脉脉的「AI无限职场」SOLO 挑战赛，拿到了 SOLO 内测权限。

说实话，一开始我是抱着试试看的心态，毕竟之前用过不少 AI 编程工具，体验都差不多——能写点代码片段，但离"真正帮你干活"还差得远。

但这次用 TRAE SOLO 从零搭了一个完整的文档网站，整个过程让我对 AI 编程工具有了全新的认知。

全程基本就是动嘴说需求，AI 自己规划、自己写代码、自己调试、自己修 bug。

下面分享整个过程和最终成果。

最终成果：LiteDocs

先看成果。我用 TRAE SOLO 从零搭建了一个叫 LiteDocs 的轻量级文档网站生成器：

核心特性：

  • :open_book: GitBook 风格三栏布局 — 侧边栏导航 + 内容区 + 右侧目录

  • :pencil: 所见即所得在线编辑器 — 不懂 Markdown 的人也能直接编辑，像用 Word 一样

  • :file_folder: 文件管理 — 拖拽上传附件，支持大文件，一键下载、复制链接、删除

  • :fire: 热部署 — 改了文件自动重新构建，浏览器自动刷新

  • :magnifying_glass_tilted_left: 实时搜索 — 输入关键词即时过滤导航

  • :mobile_phone: 响应式 — 手机、平板、电脑都能用

  • :rocket: 零依赖 — 纯 Python 标准库，一条命令启动

技术栈： 纯 Python（约 1000 行）+ 原生 HTML/CSS/JS，没有任何第三方依赖。

开发过程：我是怎么"动嘴"的

整个过程大概分了几个阶段，每个阶段我基本都是说一句话，然后看着 AI 自己干活：

第一阶段：搭骨架

我说：“帮我做一个 GitBook 风格的文档网站，纯 Python，零依赖，支持 Markdown。”

TRAE SOLO 做了这些：

  1. 自己规划了项目结构（build.py、templates、theme、docs）

  2. 写了一个简易 Markdown 解析器（支持标题、列表、代码块、表格等）

  3. 实现了目录扫描 → HTML 生成 → 静态文件输出的完整构建流程

  4. 写了三栏布局的 CSS（GitBook 风格）

一句话，一个完整的文档站骨架就出来了。

第二阶段：加编辑器

我说：“加一个在线编辑器，要所见即所得的，方便不懂 Markdown 的人用。”

TRAE SOLO 做了：

  1. 基于 contenteditable 实现了富文本编辑器

  2. 加了完整的工具栏（粗体、斜体、标题、列表、链接、图片、代码等）

  3. 实现了 HTML ↔ Markdown 双向转换

  4. 加了可视化/源码双模式切换

  5. 保存时自动转回 Markdown 格式存储

第三阶段：文件管理

我说：“要能上传和下载附件，支持大文件，方便把常用软件放上去分享。”

TRAE SOLO 做了：

  1. 实现了拖拽上传区域

  2. 加了上传进度条（显示文件名、队列位置、百分比）

  3. 大文件上传改为流式写入（1MB 分块），不占满内存

  4. 加了下载、复制链接、删除功能

第四阶段：修 bug（最让我惊喜的部分）

开发过程中遇到了不少 bug，TRAE SOLO 基本都能自己定位并修复：

问题 AI 的处理
API 返回空响应 自己发现 wfile.write 后没 flush，加了刷新
构建时删除 site 目录导致服务器崩溃 改用 directory 参数，不再依赖 os.chdir
大文件上传内存溢出 改为流式处理，先 peek 64KB 找 filename，再分块写入
上传后文件列表被清空 发现 innerHTML 销毁了 DOM 元素，改为在 HTML 中直接包含空状态
符号链接在各种文件系统下的兼容问题 加了多层 fallback：符号链接 → 复制 → 逐个文件复制

这个过程最让我震撼的是：我不需要告诉它 bug 在哪，它自己看报错信息、自己定位、自己修。

image
image2986×1710 409 KB

image
image2978×1468 283 KB

image
image2976×1458 277 KB

image
image2966×1476 221 KB

一些技术细节（给感兴趣的同学）

附件存储：符号链接方案

附件存在 docs/_files/，site/_files/ 是相对路径符号链接（../docs/_files），文件只存一份不占双份空间。每次启动自动创建/修复符号链接，如果创建失败自动降级为复制模式。

大文件上传：流式处理

没有把整个请求体读入内存，而是：

  1. 先读取前 64KB 找到 filename

  2. 定位 header 结束位置

  3. 剩余数据 1MB 分块流式写入临时文件

  4. 最后读取末尾 1KB 截断 boundary 标记

前端自动刷新

构建时写入 .version 时间戳文件，前端每 3 秒轮询，版本变化自动刷新。

我的真实感受

说实话，这次体验颠覆了我对 AI 编程工具的认知：

  1. 真正的"动嘴干活" — 不需要写代码，说需求就行，AI 自己规划、执行、调试

  2. 不是代码补全，是完整的工程能力 — 从架构设计到 bug 修复，全流程覆盖

  3. 踩坑能力很强 — 遇到符号链接兼容性这种刁钻问题，AI 自己搜索、分析、解决

  4. 一个人就是一支团队 — 以前搭这种东西至少要几天，现在一个下午搞定

如果你也想体验，参加 TRAE × 脉脉的「AI无限职场」SOLO 挑战赛就能拿到内测权限！

项目地址

项目完全开源，零依赖，一条命令启动：

Bash

git clone https://github.com/qinyue530/lite-docs
cd lite-docs
python build.py --watch

然后打开浏览器访问 http://localhost:8080 就能看到文档站，访问 http://localhost:8080/editor.html 就能在线编辑。

最后

AI 编程工具正在从"辅助写代码"进化到"独立完成工程"，TRAE SOLO 目前是我体验过的最接近这个目标的产品。

推荐大家都去试试，特别是参加挑战赛拿内测权限，亲自体验一下"动嘴写项目"的感觉。

TRAE × 脉脉「AI无限职场」SOLO 挑战赛持续进行中，参赛即可开通 SOLO 内测权限！

2

插个眼 :saluting_face: :+1:

3

更新补充（最新功能）
项目上线后又迭代了一波实用功能，继续"动嘴"让 AI 帮我完善：

:open_file_folder: 目录管理
新建目录：编辑器里可以直接创建新的文档分类
删除目录：空目录才能删除（排除 .DS_Store 等隐藏文件），防止误删数据
_files 保护：附件目录前后端双重保护，彻底杜绝误删
:evergreen_tree: 智能文件树
文件越来越多后找文件很费劲，加了这几招：

功能 效果
折叠/展开 点击目录标题折叠/展开，箭头 ▼/:play_button: 指示，状态自动记忆
实时搜索 顶部搜索框输入关键词即时过滤，匹配文件自动展开所在目录
拖拽调宽 侧边栏右边缘可拖拽调整宽度（180px ~ 500px），长文件名也能看清
_files 显示 附件目录排在最后，直接列出所有上传的文件，一键复制链接
:wrench: 体验优化
文件删除同步：上传/删除附件后，左侧文件树和文件管理面板同步刷新
文件名截断：超长文件名自动省略号截断，hover 或拉宽侧边栏查看完整名
感受：这些功能从提需求到上线也就几分钟，AI 自己规划交互方案、写代码、处理边界情况。我只用说"文件多了找起来麻烦"，它自己就想到搜索+折叠+拖拽调宽这一整套方案。

image
image3024×1478 193 KB

1 个赞
4

又双叒叕更新了！LiteDocs 新增文件清单 + 历史记录功能

之前分享过用 TRAE SOLO 从零搭建的文档站 LiteDocs，这段时间又迭代了两个重磅功能，继续"动嘴"让 AI 帮我完善：

:clipboard: 文件清单自动更新

痛点：附件越来越多，团队成员不知道有哪些资源可以下载。

方案：自动生成一个「文件清单」页面，每次上传/删除附件时自动同步。

效果：

  • 上传新附件 → 文件清单自动追加一行

  • 删除附件 → 文件清单自动移除对应行

  • 支持手动编辑说明文字，自动更新只修改标记区域内的表格

  • 侧边栏导航中强制排在最后，首页底部有直达链接

技术实现：用 HTML 注释标记界定自动更新区域，只替换标记内的表格，保留用户手动添加的头部和尾部内容。

:one_o_clock: 历史记录自动备份

痛点：误删文件或改错内容，没有后悔药。

方案：每次保存/删除文件前，自动备份当前版本到 .history 目录。

效果：

  • 保存文件前 → 备份为 文件名_20260506_104307.md

  • 删除文件前 → 备份为 文件名_20260506_104307_deleted.md

  • 删除附件前 → 备份到 .history/_files/ 目录

  • 精确到秒的时间戳，方便定位版本

  • .history 是隐藏目录，不出现在导航中

  • 可随时手动删除清理历史记录

技术实现：save_history() 函数在 _write_file、_delete_file、_delete_attachment 三个操作前调用，使用相对路径保持目录层级。

:light_bulb: 一些设计细节

文件清单的强制排序：

  • 后端 scan_docs 和后端 _get_tree 都跳过 . 开头的隐藏目录

  • 文件清单在侧边栏导航中强制排最后（提取-追加模式，不受字母排序影响）

  • 编辑器文件树中 _files 目录同样强制排最后

历史记录的目录结构：

Plain Text

docs/.history/
├── README_20260506_104307.md
├── 培训资料/
│   └── 新人入职指南_20260506_110000.md
└── _files/
    └── 软件安装包_20260506_104349_deleted.exe

智能更新 vs 手动编辑：

  • 文件清单用 <!-- AUTO_FILES_START --> / <!-- AUTO_FILES_END --> 标记界定自动区域

  • 用户可以在标记外随意添加说明文字，不会被覆盖

  • 如果格式乱了，删除标记区域内容，下次上传/删除时会自动重新生成

:bullseye: 使用建议

文件清单：适合放团队共享的软件安装包、脚本工具、设计稿等资源，新人入职一眼就能看到有哪些东西可以下载。

历史记录：建议定期手动清理（直接删除 .history 目录或其中的文件），避免占用过多磁盘空间。误删文件时到 .history 目录下找对应时间戳的备份，复制回原位置即可恢复。

感受：这两个功能从提需求到上线也就十几分钟，AI 自己规划了标记区域、时间戳命名、隐藏目录跳过等细节。我只用说"需要一个文件清单页面"和"误删了要能恢复"，它自己就想到自动同步、历史备份、智能合并这些方案。

项目地址：https://github.com/qinyue530/lite-docs

1 个赞
5

标题让我想到了“君子动嘴不动手”哈哈哈

1 个赞