Cocos Creator 入门：从环境配置到用 Codex 做出贪吃蛇（0 到 1）
想学 Cocos Creator，却总卡在“环境怎么装、项目怎么看、第一行代码怎么跑”这几步？这篇文章就从零开始，带你完成下面三件事：
- 安装并配置 Cocos Creator；
- 看懂项目目录，跑通第一段 TypeScript 脚本；
- 把空项目交给 Codex，做出一个可以直接玩的 2D 贪吃蛇。
本文以 Cocos Creator 3.x 的使用方式为主。不同小版本的菜单位置可能略有区别，但整体流程一致。
一、安装 Cocos Creator
先进入 Cocos Creator 下载页面：点击下载 Cocos Creator。
下载并打开 Dashboard 后，需要先安装编辑器。新手建议选择稳定版本；如果是团队协作，记得和项目使用的版本保持一致，否则可能出现项目升级或资源兼容问题。
二、创建第一个 2D 项目
进入 Dashboard 的“项目”页面，点击右上角的“创建项目”。
选择一个 2D 模板，填写项目名称和保存路径，然后创建项目。编辑器成功打开后，我们的 Cocos 空项目就准备好了。
三、配置语言、代码编辑器和预览浏览器
打开“偏好设置”，可以根据自己的习惯调整编辑器语言。
接着在“外部程序”中设置常用的代码编辑器和预览浏览器。我这里使用 VS Code；配置完成后，双击脚本就能直接跳到编码界面，不用每次手动找文件。
四、跑通第一行代码
先在assets中新建一个 TypeScript 脚本，例如HelloCocos.ts。
双击脚本后，Cocos Creator 会调用刚才配置的编辑器打开它。左侧是项目目录，右侧就是熟悉的代码区。
可以先用一段最简单的代码测试环境：
import{_decorator,Component}from'cc';const{ccclass}=_decorator;@ccclass('HelloCocos')exportclassHelloCocosextendsComponent{start(){console.log('Hello Cocos');}}保存脚本后，把它拖到场景中的任意节点上，作为组件挂载。注意：只创建脚本但不挂到节点，start()不会执行。
点击编辑器顶部的运行按钮，Cocos Creator 会在浏览器中预览当前场景。
按F12打开浏览器开发者工具。如果控制台里出现Hello Cocos，就说明编辑、编译和预览这条链路已经全部跑通。
五、看懂 Cocos Creator 项目目录
Cocos Creator 3.x 项目中常见的目录和文件如下：
assets：项目最核心的目录，存放场景、脚本、图片、音频、字体和预制体等资源。library：编辑器导入并处理资源后生成的缓存。它丢失或损坏时，可以关闭编辑器后删除，再重新打开项目生成。local：当前电脑上的本地配置，例如窗口布局等，一般不需要手动修改。profiles：编辑器和构建等相关配置。settings：项目设置，团队协作时通常需要纳入版本管理。temp：临时缓存目录，关闭编辑器后可以重新生成。build：执行构建后生成的产物目录。package.json：项目配置文件，也是 Cocos Creator 3.x 识别项目的重要文件之一。
日常开发主要和assets打交道。一个小型 2D 项目可以这样整理：
assets/ ├── art/ │ ├── textures/ │ ├── spritesheets/ │ └── ui/ ├── audio/ │ ├── bgm/ │ └── sfx/ ├── scripts/ │ ├── components/ │ ├── managers/ │ └── utils/ ├── scenes/ ├── prefabs/ ├── fonts/ └── data/目录不必一开始就拆得特别细，但脚本、美术、音频和场景最好分开。项目一旦长大，清晰的目录结构能省下大量找文件和处理冲突的时间。
另外，assets中每个资源旁边自动生成的.meta文件记录了资源的标识和引用关系，不要随意删除；使用 Git 时，也要把它和对应资源一起提交。
六、用 Codex 制作 2D 贪吃蛇
环境跑通后，就可以进入实战了。这次我直接把一个 Cocos Creator 2D 空项目交给 Codex，让它完成贪吃蛇小游戏。
最终效果如下：
我使用的提示词并不复杂，核心就是两件事：告诉 Codex 要做什么，以及允许它直接修改当前 Cocos 项目。例如：
在当前 Cocos Creator 2D 项目中实现一个可以运行的贪吃蛇小游戏。
请直接修改项目文件，完成蛇的移动、食物生成、碰撞判断、计分和重新开始，并确保浏览器预览可以正常运行。
然后把 Cocos 项目文件夹交给 Codex，让它读取现有结构并直接修改代码即可。
这次使用的是空项目，也没有额外提供美术素材，所以成品更偏“程序员原型”：功能先跑起来，画面保持简洁。如果你已经准备好了蛇身、食物、背景、按钮和音效等素材，可以一起放进assets，并在提示词中明确素材路径、目标风格和交互要求，最终效果会完整很多。
生成完成后，不要只看“能不能启动”，建议再检查下面几项：
- 方向键或
WASD是否都能正常控制； - 是否禁止直接反向移动；
- 食物是否会生成在蛇身之外；
- 撞墙、撞到自己后是否正确结束；
- 分数、重新开始和连续游玩是否正常；
- 浏览器控制台是否存在报错。
总结
从安装 Cocos Creator、配置 VS Code，到跑通Hello Cocos，再到让 Codex 完成贪吃蛇，整个过程并不复杂。真正关键的是先搭好可运行的最小项目，再把需求、操作范围和验收标准说清楚。
AI 可以帮我们大幅加快写代码和搭原型的速度，但最后的运行验证、问题定位和体验打磨仍然不能省。先让游戏动起来，再一点点把它变好，这才是最适合新手的 0 到 1。