Vibe Coding 实践：用 PACT 法把编程变成一场高效对话

接触 AI 的旅程，是一个对协作关系不断深化理解的过程。我们往往始于把它当作一个万能的“搜索工具”，但真正的突破，发生在我们学会与它“交流”的那一刻。当你开始将 AI 视为一个潜力无限的伙伴，而不仅仅是一个冰冷的程序时，它便能帮你将脑海中的蓝图快速变为现实。

从“搜索工具”到“方法论”的进化

我与 AI 的关系，早已从“使用工具”进化到了“并肩协作”。但真正的突破，发生在我将这种协作模式系统化，并提炼出了一套名为 PACT 的方法论。

PACT，即意图 (Purpose)、属性 (Attributes)、约束 (Constraints)、任务 (Task)。它的核心理念，是教会我们像产品经理一样向 AI 下达指令，给它一份清晰、完整的“需求单”。

最近，我正是用这套方法，与 AI 伙伴（Cursor）协作，在半天时间内，从零打造了一个实时匿名投票 H5。这篇文章，我将详细拆解这个项目，向你展示如何利用 PACT 法，解锁你的 Vibe Coding 潜能。

🎯 PACT 法实战：我和 Cursor 用半天时间打造了实时投票应用

P - 意图 (Purpose)：从一个简单的想法开始

我的意图很简单：创建一个轻量、匿名、实时、移动端适配的 H5。 我厌倦了市面上那些需要注册、填写复杂表单的投票工具。这个意图，为我们后续的协作奠定了基调。

A - 属性 (Attributes)：定义项目需求与特性

明确意图后，我们来定义这个应用的属性。我把所有需求和技术特性都清晰地列出来，作为给 AI 的“需求清单”。

项目需求属性：

• 核心功能: 创建投票、链接分享、实时结果、匿名防刷。
• 非功能需求: 性能高，移动端适配，加载迅速。

技术栈属性：

• 前端: React + Vite
• 样式: Tailwind CSS + shadcn/ui
• 后端服务: Supabase + Supabase Realtime

像这样，在开始编程前，先和 AI 沟通好这些属性，它就能更准确地理解你的需求，并生成符合这些特性的代码。

C - 约束 (Constraints)：设立协作边界与规范

接下来，我为 AI 设立了项目开发的约束。这些约束确保了最终代码的质量和可维护性。

1. 全局规则（项目级约束）：

   我利用 Cursor 的 Rules 功能，将编码规范“刻进”了它的脑子里，如“遵循 shadcn/ui 设计风格”、“使用 TypeScript”、“所有组件都应该是可复用的”。

2. 指令级约束：

   当我提出具体任务时，我会给它明确的指令。例如，我不会说“帮我写个按钮”，而是“请使用 React + TypeScript + Tailwind CSS 创建一个可复用的 Button 组件，根据 variant (类型为 ‘confirm’, ‘delete’, ‘cancel’) 应用不同的背景色…”。这些精准的指令，就是给 AI 的“微观约束”。

T - 任务 (Task)：将项目拆解，步步为营

最后，我们将整个项目拆解为一系列清晰的任务。这是 PACT 法的执行阶段，每一步都围绕着我们设定的 意图、属性和约束 来进行。

• 任务 1：项目骨架搭建：通过对话，快速初始化 Vite 项目，并配置好 Tailwind CSS 和路由。
• 任务 2：UI 基础配置：让 Cursor 生成 ui-config.ts 和一个 UIShowcase 页面，用于集中展示和调试所有组件。
• 任务 3：创建投票页：描述表单需求，AI 快速生成包含标题、选项、有效期等功能的表单组件。
• 任务 4：核心投票与结果页：指令 AI 集成 Supabase API，用 Recharts 实时展示结果。
• 任务 5：附加功能：逐一提出“防刷票”、“离线检测”、“分享链接”等需求。
• 任务 6：UI 视觉重构：调整全局字体、颜色、圆角和阴影。

整个过程行云流水，我更像一个“架构师”或“项目经理”，把控方向和质量，而繁琐的“搬砖”工作则交给了 AI 伙伴。

🚀 工作流总结：用 PACT 法，跑出 H5 开发加速度

通过这个项目，我沉淀出了一套能极大加速 H5 开发的现代化工作流，其核心就是 PACT 方法。

1. 意图驱动，明确边界

   在敲下第一行代码前，用最朴素的“做/不做清单”（✅/❌ List）来定义产品的最小可行范围（MVP）。

2. 善用工具，站在巨人肩上

   Vite + React + TS、Tailwind CSS + shadcn/ui、Supabase 这样的工具组合让你从繁琐的细节中解放出来，专注于功能实现。

3. AI 协作，人机结对编程（PACT 法）

   将 AI 定位为伙伴，通过“上下文 + 规则 + 精确指令 + 迭代”的模式进行协作。让 AI 处理 80% 的模板化、重复性代码，让你聚焦于 20% 的核心业务逻辑和架构设计。

4. 迭代开发，小步快跑

   遵循从骨架 -> 核心功能 -> 附加功能 -> UI 优化的路径。每完成一小部分，就进行测试和验证。

总而言之，未来的开发，不再仅仅是人与代码的交互，更是人与 AI 的高效协作。转变你的思维，把 AI 当作伙伴，通过 PACT 法将你的创意变为现实的距离，从未如此之近。