摘要：今天我就带大家从零开始，用AI辅助写代码。20/月订阅费∗∗+∗∗额外Token费用（重度用20/月订阅费∗∗+∗∗额外Token费用（重度用100-200/月）比如：

用 DeepSeek、豆包 等AI工具 输入你的需求，让它帮你整理一段完整、规范的提示词 再把这段话复制到 Comate 里执行

AI 辅助 AI —— 这才是现代程序员的高效打开方式。

正文：

大家好，这里是一只凉布丁。因为带娃呢也好久没给大家更新视频了哈。

最近很多初学编程的小伙伴跟我吐槽，说公司下了指标要用AI编程。但是无从下手，我猜测应该是那些概念如Codex、Token、模型……等一大堆名词搞混了，并且观念还停留在问ChatGPT，豆包，deepseek等传统问答AI然后根据回答复制粘贴代码。

今天我就带大家从零开始，用AI辅助写代码。依然是前端视角，争取让你一看就懂，一学就会。

一、常见的工具以及概念解释

首先我这里先把工具还有Token等概念简单整理了一下：

我们可以这样通俗理解：

Codex、Comate 这类工具，就像是“管家”，也可以简单理解成用AI帮忙写代码的门槛。
让管家干活，需要付“薪酬”——这个薪酬就是 Token。
模型，则是管家掌握的“技能框架”。

有了简单认知后，我给大家列了三个目前来说相对流行的工具

如何选择工具

二、为什么我推荐 Comate？（免费！当然优势也仅仅是免费）

我本来想演示 Codex 或 Claude Code，但它们：

• 需要翻墙（视频不好过审）
• Claude 综合能力强，但不稳定、容易封号
• 多数需要付费

所以这次我用国产的 Comate 来演示。

如果你只是想在老板面前表现一下、快速上手AI编程，无脑用 Comate 就行——它最大的优势是：免费，不用“付费上班”。但是呢，个人感觉哈，对比其他来说，确实逊色一些。当然如果你只是用来初步了解，开发一些简单需求，或者说想从频繁复制粘贴这种琐事解脱出来，也够用了。

💡 如果有预算 & 网络条件，我个人会推荐Codex，这里我就不展开讲了。

三、实战：VSCode + Comate 生成一个 H5 项目

1️⃣ 安装与登录

• 打开 VSCode
• 进入插件市场，搜索 Comate
• 安装后根据提示登录即可

（其他编辑器操作基本类似，大家也可以问问Deepseek,豆包等）

2️⃣ 第一次使用：直接提需求

在 Comate 的对话框中，直接输入你的目标。比如：

“帮我用 Umi 搭建一个 H5 项目，设计稿宽度 750px。最终效果是：设计稿上多少 px，自动帮我转换成 vw / vh。”

然后 AI 就会开始生成项目。

3️⃣ 项目生成完毕

你会得到一个基础的前端项目结构。
但你会发现——AI 有时候挺啰嗦的。

四、让 AI 听话：自定义规则

如果你希望 AI：

• 对话简洁、不啰嗦
• 命名符合前端规范（比如不用驼峰，改用指定风格）

可以这样做：

在 Comate 对话框中输入：
“帮我定一个规则：我们的对话不要太啰嗦，所有命名必须符合前端开发规范。”

运行之后，项目里会多出一个  .comate 文件夹，里面有 rule 等子目录。

这个文件夹，可以理解成 Comate 的配置文件目录。
每次对话或生成代码，都会参考里面的规则。

五、进阶概念

随着你们接触，或者说在接触过程会有下面几个概念，这里我加入自己的一些理解简单列一下。

💡 每个概念通常都有对应的指令，不需要死记硬背。遇到什么问题也可以直接跟ChatGPT，豆包，deepseek等，让他帮你写指令

六、真正的“省力技巧”

遇到不会写或记不清的配置，可以直接让另一个AI帮你生成话术。

比如：

• 用 DeepSeek、豆包 等AI工具
• 输入你的需求，让它帮你整理一段完整、规范的提示词
• 再把这段话复制到 Comate 里执行

AI 辅助 AI —— 这才是现代程序员的高效打开方式。

最后总结一下：

1. 新手首选 Comate：免费、国产、不用翻墙
2. VSCode 安装插件，对话框直接提需求
3. 用 .comate/rule 控制 AI 行为
4. 复杂需求 → 先用另一个AI生成提示词 → 再交给 Comate