一、背景
AI Coding犹如一把绝世好剑，不同之人有不同感受，根本在于如何习得最核心剑法才能发挥最大的威力。 有人视之为神兵利器，可一剑开天辟地；有人却如持钝刀，徒有其形而无其神。真正的剑客深知，剑法之精髓不在剑本身，而在于剑心、剑意、剑势的完美融合。AI Coding亦是如此——掌握核心思维，方能人机合一，代码如行云流水，项目如虎添翼。
二、技巧
如下笔者总结了AI Coding常见10种技巧与思维，希望能助力各路大神们AI功力大增
2.1 结构化沟通让AI秒懂你的需求
结构化沟通是AI可理解的表达方式，通常由背景、需求、约束、输出四部分构成。但每次prompt都输出这四部分对开发者是不友好的，坚持一段时间后很容易放弃。其本质可以精简为最核心的两步：目的+约束
案例： 实现商品多选组件的开发,其prompt可以是：实现商品多选组件，支持多选、全选、商品价格与数量显示，要求在/components目录下并且使用xxx组件库实现。其中蓝色部分是目的，绿色部分是约束。
拓展：为了解决Vibe Coding存在缺乏系统性规划、文档缺失、可扩展性差、团队协作等问题；AI社区出现了几种热门的结构化AI沟通方法论，如Spec、6A、PRP等，感兴趣的阅读从Vibe Coding到结构化开发
2.2 精准上下文让AI不再胡说八道
经常有小伙伴反馈AI在实现某模块时出现乱改、输出文件错误、效果不佳等现象，不妨试试精确上下文这招。
技巧1： 把待修改的文件、函数、代码片段扔给上下文，直接精确到具体位置，而不是让AI猜测在哪里改，如何改（代码片段可以直接ctrl+c，ctrl+v复制到AI对话框，如图2）
技巧2：一个AI编辑器窗口保证只打开一个工程，其它工程会造成上下文干扰，从而导致编码不佳。
技巧3：一个任务窗口只干一件事，AI的记忆窗口会自动关联当前任务的历史对话，如果在一个窗口频繁处理多个不相干的模块，效果肯定不及集中处理一件事的效果好。因此，建议为每个独立的功能模块或任务创建专门的对话窗口，让AI能够更好地理解上下文，提供更精准的代码建议和解决方案。
2.3 小步迭代+测试+git管理，让AI帮你稳扎稳打
2.3.1 常见问题
1.基于AI实现某一功能时越改越多、越改越乱；实现了模块a,模块b受到影响，屎山代码趋于成形，最后无奈回归手写。
2.使用AI实现了需求的80%功能，没有及时用git保存，后续的功能AI始终无法实现，且前面80%的代码被越改越乱，无奈只能全局放弃导致前功尽弃。
2.3.2 技巧
小步迭代法，完成一个小步骤后就使用Git保存代码，即使AI后面改崩了，你也能轻松回滚，不至于前功尽弃。
graph TD A[项目启动] --> B[项目模块拆分] B --> B1[Git保存: 项目结构初始化] B1 --> C[模块1开发] B1 --> D[模块2开发] B1 --> E[模块3开发] B1 --> F[模块N开发] C --> G1[AI对话 - 需求分析] D --> G2[AI对话 - 需求分析] E --> G3[AI对话 - 需求分析] F --> G4[AI对话 - 需求分析] G1 --> H1[AI对话 - 代码生成] G2 --> H2[AI对话 - 代码生成] G3 --> H3[AI对话 - 代码生成] G4 --> H4[AI对话 - 代码生成] H1 --> I1[结果验证与代码Review] H2 --> I2[结果验证与代码Review] H3 --> I3[结果验证与代码Review] H4 --> I4[结果验证与代码Review] I1 --> J1{质量评估} I2 --> J2{质量评估} I3 --> J3{质量评估} I4 --> J4{质量评估} J1 -->|通过| K1[模块完成] J1 -->|不通过| L1[反馈优化] J2 -->|通过| K2[模块完成] J2 -->|不通过| L2[反馈优化] J3 -->|通过| K3[模块完成] J3 -->|不通过| L3[反馈优化] J4 -->|通过| K4[模块完成] J4 -->|不通过| L4[反馈优化] L1 --> L1_1[优化完成] L2 --> L2_1[优化完成] L3 --> L3_1[优化完成] L4 --> L4_1[优化完成] L1_1 --> L1_2[Git保存: 优化完成版本] L2_1 --> L2_2[Git保存: 优化完成版本] L3_1 --> L3_2[Git保存: 优化完成版本] L4_1 --> L4_2[Git保存: 优化完成版本] L1_2 --> G1 L2_2 --> G2 L3_2 --> G3 L4_2 --> G4 K1 --> K1_1[Git保存: 模块完成版本] K2 --> K2_1[Git保存: 模块完成版本] K3 --> K3_1[Git保存: 模块完成版本] K4 --> K4_1[Git保存: 模块完成版本] K1_1 --> M[模块集成] K2_1 --> M K3_1 --> M K4_1 --> M M --> N[整体质量验证] N --> O{整体评估} O -->|通过| P[项目完成] O -->|不通过| Q[整体反馈优化] Q --> Q1[优化完成] Q1 --> Q2[Git保存: 整体优化完成版本] Q2 --> B2.3.3 案例演示
需求：假设需要实现一个短信验证弹窗组件，具备短信验证，60s倒计时重试、错误信息提示、手机号加密等功能。我们采取的方案是小步迭代，而不是整体输入prompt给AI
第一步：先实现UI，git保存功能1第二步：再实现交互、git保存功能2第三步：实现具体逻辑1、2、3，git保存记录3假设第3步出错或者AI效果不佳可以及时回退2.4 合理设计Rules架构
多Rules分层设计是当前AI生码的主流架构，通过规则分离、职责清晰、扩展性强、维护性好的特点，从根本上解决了全局Rules中规则失效的问题，显著提升了AI生码准确率、维护效率和团队协作效果。如下是一份前端项目Rules架构设计，大家可以根据实际项目情况进行拓展优化。
graph TD A[Rules架构] --> B[通用规则层<br/>Common Rules] A --> C[领域规则层<br/>Domain Rules] B --> B1[项目结构规则<br/>project-structure.md] B --> B2[代码规范规则<br/>code-style.md] B --> B3[技术栈约束规则<br/>tech-stack.md] C --> C1[.tsx文件规则<br/>tsx-rules.md] C --> C2[.css/.scss文件规则<br/>css-rules.md] C --> C3[.ts文件规则<br/>ts-rules.md] C --> C4[业务逻辑规则<br/>business-rules.md] 2.5 错误排查技巧让你秒变AI医生
随着AI问世，当前任何的错误日志都可以让AI提供解决方案。
2.5.1 Cursor、Catpaw等AI编程工具终端提示报错
AI编辑器终端报错可以一键Add to Chat交给AI解决，如下图
2.5.2 浏览器控制台报错、ts错误、eslint、公司基建talos、fedo等错误日志
复制关键错误信息交给AI处理，关键信息通常指错误message、行号列号、文件位置
2.5.3 页面UI与设计稿偏差大
值得注意的是 AI 目前难以做到逐像素还原，但在页面结构与布局复刻上表现出色。 因此如遇到AI还原UI设计稿到页面布局结构较差时，可将设计稿与页面截图都输入给AI进行调整，而不是纯文字描述xx部分布局不对。
案例prompt：图xx是设计稿，页面实际截图是xxx，页面xxx部分布局还原不正确，请调整
2.6 Code Revice至关重要
2.6.1 常见问题
1.用 AI 完成存量需求 a，功能自测通过，但其悄改通用工具方法，牵连其他模块，最终线上出错。根因：缺乏变更影响评估与严格 Code Review。
- 用AI持续迭代了需求时，只考虑功能的正常使用，缺少严格的Revice导致代码难于理解与维护，后续编码成本巨大，开发者需要花费额外的成本去理解AI Coding
2.6.2 技巧
- 每实现一小步功能模块后，就进行Code Revice，避免AI将业务代码、通用方法、常量累积到单文件中造成屎山代码累积。切勿抱着AI Codind代码只要通过功能测试就ok的心态，后续逐渐发展成屎山代码后期维护成本极高。
2.7 脏活累活交给AI，你只管做有挑战的事
编码中有许多重复性的工作都可以放心交给AI，个人注意力核心聚焦在核心功能模块设计即可。让AI处理繁琐的工程化任务，开发者专注于业务逻辑和创新性工作。
通用的方法、工具函数编写直接交给AI
1.通用工具函数编写：数据处理函数、格式化工具、业务工具、性能优化
2.代码重构与抽离：在编码时单文件经常出现业务代码、常量、通用方法、组件封装在一起，这被称为”坏味道代码”，借助AI可以快速抽离封装并导入，让代码结构更加清晰和可维护。prompt示例如下
将xxx方法封装到src/lib/utils.ts中将xxx组件抽离到src/components/common/目录下将xxx常量提取到src/lib/constants.ts中将xxx类型定义移动到src/types/目录下3.工程化任务：测试用例、文件or组件or方法说明文档快速生成
2.8 先设计结构，再让AI帮你实现
常见问题： 使用AI输出代码时，往往很容易出现业务逻辑、UI、静态变量、通用方法输出在同一个文件中，虽然功能与测试是ok的，但后期维护成本是巨高的。
AI Coding时结构先行，有3种思路。
- 在Cursor、Catpaw等AI工具中配置全局rules，添加项目编码要求和分层结构规范，让AI从一开始就按照正确的架构生成代码。AI实现某一模块功能后，及时进行代码审查，将不合理的代码使用AI进行分层抽离。切忌累积大片代码后再分离，耗费成本且风险较高。在与AI对话过程中，明确指定：实现xx功能，将方法输出到xx文件，静态变量输出到xx文件，确保代码从一开始就按正确结构组织。
2.9 遇到难题找AI聊聊技术方案
AI可以为复杂或创新性问题提供多维度思路和实现方案。通过对话式交互，开发者可以快速完成问题拆解与方案落地。
案例：团队需要开发一个 CLI 工具，能够根据项目安装的组件库版本，自动从组件库仓库拉取对应版本文档到本地，作为 AI 生码的参考依据。借助AI几分钟内获得多种技术路径与实现指导。通过AI对话，复杂的技术选型问题变成了结构化的决策过程，大大提升了开发效率和方案质量。
2.10 使用最新模型且定期更新AI工具
在一次交流中，有同学反馈AI代码生成效果未达预期。深入了解后发现，该同学仍在使用ChatGPT-4模型，且AI工具版本相对滞后。从技术编码能力来看，Claude最新模型确实在代码生成方面表现更为出色。同时，现代AI工具都在持续迭代优化提示词工程和上下文理解能力，因此使用Claude最新模型并保持AI工具的定期更新，对于获得最佳编码体验是至关重要的。关闭Cursor等AI编辑器的auto模式（auto由系统分配随机模型，大概率是非Claude）
三、认知迭代
3.1 AI让技术平权，其上限仍有个人能力决定
当前"人人皆可AI编程"的浪潮确实引发了一些程序员的职业焦虑。然而，虽然AI显著降低了技术门槛，但真正高质量、可维护、符合业务需求的软件产品，仍然高度依赖技术人员在架构设计、业务理解和细节优化方面的专业能力。这些深层次的技术判断和决策，是非技术人员难以直接参与的。
举个前端最常见的案例：
以输入框防抖机制为例，非研发人员借助AI生成的代码往往缺乏防抖优化，即使想改进，也需要根据接口响应情况进行分析判断。然而，非研发人员通常无法识别这类技术优化点，更难以进行针对性的性能调优。
3.2 AI Coding时代，最重要的能力有哪些？
1.提示词与上下文能力
日常与AI对话的提问本质上就是提示词，而上下文则是指为AI提供的补充信息，让AI"理解"当前任务的所有相关背景。优质的提示词与上下文能够显著提升AI代码生成质量，使其更贴近预期效果，从而大幅减少返工和调试时间。具体体现在掌握如何分解复杂任务、提供清晰上下文、使用正确的技术术语和约束条件。
2.代码审查与优化能力
AI生成的代码往往存在质量问题、性能问题、或不符合最佳实践的情况，需要具备快速识别和修复这些问题的能力。优秀的代码审查与优化能力能够确保代码的可靠性、可维护性和性能表现，避免线上故障和后续维护成本。
3.业务理解与架构设计能力
AI擅长实现具体功能，但无法理解复杂的业务逻辑和系统架构需求，需要技术人员将业务需求转化为技术方案。业务理解与架构设计能力真正解决实际问题的关键，也是AI无法替代的核心竞争力。
3.3 AI Coding不同于技术学习的按部就班，其更需要系统方法论
传统技术学习以知识掌握为中心（语法/框架/原理），要求按部就班的逐步学习；而AI Coding以问题求解与交付为中心（结果/约束/验收）；AI Coding 更依赖系统化方法论，而非线性、碎片化的知识学习。
