在体验 Antigravity 以后，我发现单纯的“对话”就像是聊天机器人。真正要把 AI 转化为生产力，得靠它的两个“外挂”：Skill（技能指令集） 与 KI（Knowledge Item，知识项）。
其实简单来说，这就是**“菜谱”与“避坑日记”**的区别。
1. Skill：大厨的手写菜谱
Skill 本质上是程序性知识。它就像一份发给 AI 这个“新入职实习生”的保命说明书。它规定了 AI 在干活时必须遵守的步法和套路，防止它因为理解偏差而“自由发挥”。
实战案例：prd-to-component-splitting.md
这是我最常用的一个技能。当你给 AI 扔下一份几十页的项目 PRD 时，它通常会看花眼。但加载了这个 Skill 之后，它会瞬间变身成一位**“十年开发经验的前端架构师”**。
它不再只是机械地读文档，而是会严格执行以下三招：
- 物理提取：识别哪些是筛选区、哪些是列表区，分得清清楚楚。
- 智能拆解：基于“高内聚低耦合”原则，决定哪些该拆成通用组件（Common），哪些该做成业务组件（Business）。顺便还会警告你：“别拆了，这个区块代码太少，过度设计了！”
- 通信契约：自动帮你预判 Props 和 Emits 的流转逻辑，甚至连插槽（Slots）的位置都给你留好了。
效果：它输出的不再是一段乱糟糟的代码，而是一棵清晰的组件树架构图。这就是给 AI 塞进了一本“代码风格指南”。
2. KI：深夜改 Bug 的避坑日记
相比之下，KI 侧重于存储事实性知识。它更像是你写给未来自己的备忘录。它记录了那些让你在凌晨 3 点抓耳挠腮的技术决策和血泪史。
最酷的一点是，它是自动补全的。当你下次遇到相似场景时，AI 会从后台默默翻开这本日记，对你说：“嗨，记得吗？咱们在这个坑里摔过，这次绕着走。”
以下是我近期存入知识库的两个典型 KI 实例，解决了移动端开发中极易被忽视的物理层交互问题：
KI 实例 A：防塌陷滚动视图骨架 (Container Boilerplate)
- 技术背景：传统移动端长列表布局常因外层容器未显式限高，导致滚动失焦或由于 JS 引擎计算负担出现卡顿。
- 解决方案：记录了一套绝对安全公式。通过
height: 100vh; overflow: hidden;将最外层页面锁死，强迫内部scroll-view真正接管 60 帧原生滚动，确保在小程序等环境中永不翻车。 - 存储价值：新项目一旦涉及局部信息流滚动，AI 即可直接调用该公式，避免重复调试容器高度。
KI 实例 B：万能移动端触控抗扰动 (Safe-Area Trap Fixer)
- 技术背景：全面屏（尤其是 iOS 设备）底部的 Home Indicator 物理黑条常会遮挡触控区，导致 UI 上的底部按钮出现“视觉存在却无法点击”的响应偏移。
- 解决方案：沉淀了基于 CSS 环境变量
env(safe-area-inset-bottom)的动态注入方案。 - 核心逻辑：通过
padding-bottom: calc(60rpx + env(safe-area-inset-bottom))建立安全边距推导器。 - 存储价值：确保未来手写任何弹窗或抽屉组件时，点击层级与物理区域永远保持严密对齐，消除了因设备差异带来的点击偏差。
3. 协同演进：从“对话”到“自动化集成”
当这两者协同工作时，AI 辅助开发的流程会发生质变：
- Skill 确定步法：我扔给 AI 一个“需求拆解技能”，它立马心领神会，不再给我甩空洞的标题，而是精准的原子化任务。
- KI 自动填坑：在写代码时，AI 默默查阅了“避坑日记”，发现我以前吐槽过苹果手机下边框遮挡按钮的问题，于是它在生成 CSS 时自动把
safe-area的计算公式给填上了。
这种模式下，AI 不再是一个简单的翻译工具，而是一个能够自主调用我个人最佳实践的协同开发者。
结语
如果说 Skill 是解决问题的“方法论”，那么 KI 就是支撑决策的“数据库”。优秀的开发者应该善于将自己的工程直觉转化为可被 AI 理解的结构化文档，从而实现从“手工业编程”向“ AI 驱动的工业化开发”转型。
留言板