TinyRobot v0.5.0 深度解读四：CLI脚手架从零搭建AI应用工程化实践

AI 应用开发的工程化痛点与解决方案

搭建一个AI聊天应用，技术门槛较高。从零开始，仅将基础设施跑通就可能耗费数天时间：

• 配置大模型接入——API Key、Provider适配，缺一不可
• 流式渲染和对话管理需手动搭建
• 工具调用（MCP插件等）的集成同样繁琐
• 会话状态和上下文管理是常见难点

TinyRobot v0.5.0新增的CLI脚手架，将这一流程压缩至几分钟。其实现原理如下。

两条路径，覆盖典型开发场景

TinyRobot CLI提供两个命令，分别对应两种典型场景，满足不同阶段的需求。

路径一：create——从零搭建完整AI项目

适合新项目、新团队、快速验证想法的场景。一条命令即可完成：

 复制代码# npm
npx @opentiny/tiny-robot-cli create# pnpm
pnpm dlx @opentiny/tiny-robot-cli create

创建完成后，根据指引安装依赖并启动项目：

 复制代码cd 
cp .env.example .env
# 编辑 .env 配置大模型 Key

开箱即用的配置：basic模板项目内置了两个大模型服务商和三个MCP插件，填写Key即可使用：

类型	名称	说明
大模型	DeepSeek	通过 VITE_DEEPSEEK_API_KEY 配置
大模型	阿里百炼	通过 VITE_ALIYUN_DASHSCOPE_KEY 配置
MCP 插件	12306 车票查询	阿里百炼提供，依赖百炼 Key
MCP 插件	高德地图	阿里百炼提供，依赖百炼 Key
MCP 插件	MCP 示例	Model Context Protocol 官方示例

配置好Key后，浏览器打开 ，即可看到完整的AI聊天应用运行。

开发者的关键收益：从执行命令到看到运行效果，整个过程不超过5分钟。无需手动配置Vite、逐个安装依赖或研究大模型接入方式——脚手架已全部处理。

路径二：add chat——在已有项目中增量注入AI聊天能力

适合已有Vue项目、希望增量集成AI能力的场景。在项目根目录执行：

 复制代码# 在已有项目根目录执行
npx @opentiny/tiny-robot-cli add chat# 或
pnpm dlx @opentiny/tiny-robot-cli add chat

根据指引选择选项后，会生成一个 TinyRobotChat 组件。将其放置在需要初始化聊天应用的位置：

 复制代码

开发者的关键收益：无需改造现有项目结构。add chat 命令自动处理依赖安装和组件生成，开发者只需将 TinyRobotChat 组件放到合适位置，即可在已有页面中嵌入AI聊天能力。

工程化设计的关键决策

决策一：双模板策略

create 和 add chat 并非同一命令的两种参数，而是两个独立模板。这一设计基于清晰考量：

• 新项目需要完整项目结构——路由、状态管理、环境配置等，缺一不可
• 已有项目仅需增量注入——组件、依赖、配置项，不多加一个文件

两者的依赖冲突处理、文件生成策略、配置方式均不同。分开模板比使用单一命令加参数更清晰，且不易出错。

决策二：内置多模型和多插件

脚手架并非生成空壳，而是内置了可用的大模型和MCP插件。这意味着：

• 即时可验证：配置Key后即可看到完整效果，无需额外安装
• 多模型对比：同时内置DeepSeek和阿里百炼，方便开发者对比不同模型表现
• MCP即体验：三个MCP插件帮助开发者快速理解工具调用的能力边界

决策三：环境变量管理

大模型Key通过 .env 文件管理，而非硬编码或交互式输入：

 复制代码# .env
VITE_ALIYUN_DASHSCOPE_KEY=your-key-here
VITE_DEEPSEEK_API_KEY=your-key-here

这保证了：

• Key不会被提交到代码仓库（.env 已在 .gitignore 中）
• 不同环境可使用不同Key
• 团队成员可独立配置，互不干扰

从“能用”到“好用”的工程化思路

CLI脚手架体现的工程化思路可概括为：降低从0到1的门槛，同时保持从1到N的灵活性。

• 从0到1：一条命令创建项目，一条命令注入能力，5分钟内看到运行效果
• 从1到N：生成的项目结构为标准Vue项目，开发者可自由扩展、替换组件、调整配置

这并非仅适用于demo的脚手架，而是“从原型到生产”的起点。生成的代码结构清晰、依赖明确、配置规范，可直接作为生产项目的基础。

快速上手清单

 复制代码# 1. 创建新项目
npx @opentiny/tiny-robot-cli create# 2. 安装依赖并配置
cd 
cp .env.example .env
# 编辑 .env，填入 API Key# 3. 启动开发服务器
npm run dev# 4. 或在已有项目中注入聊天能力
cd 
npx @opentiny/tiny-robot-cli add chat

---

系列完结：本系列从架构设计、用户体验、页面布局、工程化四个角度拆解了TinyRobot v0.5.0的核心更新。Skills让AI Agent的能力可组织、可复用；Anchor让长对话不再难读；Layout让复杂页面从“能摆出来”变为“能组织起来”；CLI让从零搭建AI应用变成几分钟的事。