跳到主要内容
版本：0.2.x

本文通过开发一个「文章管理」CRUD插件，带你体验LinaPro的AI原生开发全流程。整个过程由AI全程主导——需求分析、系统设计、代码实现、测试验证，你只需要在关键节点提供指导和决策。

开发目标​

开发一个名为linapro-content-article的源码插件，实现文章的增删改查管理功能，包括：

  • 文章列表展示与分页
  • 文章创建、编辑、删除
  • 文章状态管理（草稿、已发布）
  • 后端RBAC权限集成

整个开发过程全程由Claude Code通过规范驱动工作流驱动，预计用时 30 分钟左右。

工具集成​

本示例我们使用了Claude Code，因为它（目前）被认为是行业内最强大的AI Coding工具，其他的工具如Codex CLI、Cursor等也表现不错，大家开发中可以选择任意自己熟悉的AI Coding工具。

执行以下指令，通过终端交互的方式，可以将框架提供的Skills、项目规范和提示词集成到自己熟悉的AI Coding工具中：

make agents

前置准备​

确认已完成安装并能正常启动服务，参见环境配置和快速安装。

在项目根目录下打开Claude Code：

claude
提示

LinaPro的开发工程中，用户可以直接通过自然语言指令来驱动整个开发流程，AI会自动识别指令意图并执行相应的工作流操作。这里为了更好地演示工作流程，因此我们显式调用斜杠命令来展示每个阶段的操作。

步骤一：探索需求​

第一步是通过探索对话，让AI理解需求、分析现有架构，并帮助你思清楚要做什么。

在Claude Code中输入一些模糊的想法或者需求，与AI一起探索需求的背景和技术方案：

/opsx:explore 我想开发一个文章管理模块，支持文章的增删改查，包括标题、内容、状态（草稿/已发布）、作者信息。希望以源码插件的形式开发。

AI 会做什么：

  • 读取CLAUDE.md和openspec/目录，了解项目架构和规范
  • 浏览现有源码插件（如plugin-demo-source）作为参考
  • 分析需求，识别需要创建的数据库表、API接口、前端页面和菜单
  • 提出可能的问题和设计建议，例如文章分类是否需要、封面图片是否支持上传

你需要做什么：

回答AI提出的澄清问题，确定功能边界。 与AI来回几轮对话，直到双方对需求有共同理解，就可以进入下一步。

提示

探索需求阶段让开发者和AI相互对齐需求细节和设计方案，确保AI在后续的提案生成和代码实现阶段能够准确地按照预期进行开发。这个阶段的沟通越充分，后续的开发效率和质量就越高。

步骤二：生成提案​

需求探索完成后，让AI将讨论结果固化为正式的OpenSpec变更提案。

在Claude Code中输入：

/opsx:propose content-article

AI 会做什么：

在openspec/changes/linapro-content-article/目录下自动生成以下文档：

文件内容
proposal.md变更背景、目标范围和影响分析
design.md数据库表设计、API接口定义、前端页面结构
tasks.md分解后的实现任务清单，每条任务都有明确的完成标准
specs/增量能力规范，描述这个插件应当具备的行为

你需要做什么：

审阅AI生成的文档，重点检查：

  • design.md中的数据库表字段是否符合预期
  • tasks.md中的任务分解是否完整合理
  • 如有遗漏或偏差，直接告诉AI修正
设计看起来没问题，可以开始实现了。

步骤三：实现代码​

提案确认后，让AI按照任务清单逐条实现代码。

在Claude Code中输入：

/opsx:apply

AI 会做什么：

按照tasks.md中的任务清单，依次完成以下实现工作：

后端实现（backend/）：

1. 创建 plugin.yaml 声明插件元数据和菜单
2. 创建安装 SQL（manifest/sql/）：创建 content_article 表
3. 创建卸载 SQL（manifest/sql/uninstall/）：删除 content_article 表
4. 生成 DAO/DO/Entity 数据访问层（gf gen dao）
5. 定义 API DTO 和路由接口（backend/api/）
6. 实现控制器（backend/internal/controller/）
7. 实现业务服务层（backend/internal/service/）
8. 编写插件注册入口（backend/plugin.go）
9. 在主框架插件注册文件中接线新插件

前端实现（frontend/）：

10. 创建文章列表页（frontend/pages/article-list.vue）
    - 表格展示文章列表，含分页
    - 操作列：编辑、删除按钮
    - 工具栏：新增按钮、状态筛选
11. 创建文章表单弹窗
    - 标题、内容（富文本或多行文本）、状态字段
    - 表单验证
12. 接入后端 API

测试（hack/tests/）：

13. 编写 E2E 测试用例（TC{NNNN}-content-article.ts）
    - 测试文章创建流程
    - 测试文章编辑流程
    - 测试文章删除流程
14. 运行测试验证功能

你需要做什么：

在实现过程中，AI几乎不需要你的干预，但你可以随时查看AI生成的代码，并在发现问题时提供反馈。

实现完成后：

AI完成所有任务后，会自动完成单元测试、E2E测试，并自动触发/lina-review技能进行代码和规范审查。如果发现问题，AI会自动修正并重新审查，直到全部测试通过。

步骤四：启动服务，访问插件​

代码实现完成后，AI通常会关闭服务，并汇报工作完成。这时你可以手动启动服务，并对AI完成的工作内容如页面功能、实现源码进行查看和验收，执行以下指令：

make dev

服务启动后，打开管理工作台：http://localhost:5666/admin

安装并启用插件：

  1. 登录管理工作台（admin / admin123）
  2. 进入「扩展中心 → 插件管理」
  3. 找到linapro-content-article插件，点击「安装并启用」

访问文章管理页面：

插件启用后，左侧菜单会自动出现「内容管理 → 文章管理」入口，点击进入即可使用完整的文章CRUD功能。

如果需要调整权限，进入「权限管理 → 角色管理」，给对应角色分配文章管理的按钮权限。

发现问题时，使用/lina-feedback反馈：

验收过程中如果发现Bug、功能不完整或体验问题，可以直接在Claude Code中描述，AI会针对性修复并完成测试：

/lina-feedback 文章列表的分页不正确，第2页显示的数据与第1页重复

AI会：

  • 将问题记录为tasks.md中的FB-N任务
  • 分析根因，实施最小化修复
  • 编写E2E测试验证修复效果，并检查关联模块的回归风险

描述越具体（「在哪里」「做了什么」「期望结果」「实际结果」），定位越快。一次可提交多个问题，AI会逐一处理后汇报修复摘要。

提示

对于需要长期维护的产品项目而言，这个阶段你也需要审查AI生成的代码，确保实现逻辑符合预期。如果你在这个阶段忽略了审查，AI有可能会偷偷给你埋一些小坑，等到后续迭代时你才发现，这时修复成本就比较大了。

步骤五：归档变更​

功能验证完成后，将本次迭代变更归档，让规范沉淀为项目基线。

在Claude Code中输入：

/opsx:archive

AI 会做什么：

  • 再次执行全面的代码和规范审查
  • 将增量规范同步到openspec/specs/作为基线
  • 将变更目录移动到openspec/changes/archive/完成归档

归档后，这次迭代的所有设计决策、接口规范和实现细节都有完整的文档记录，AI在下一次迭代中可以基于这些已验证的规范继续推进。

小结​

通过这个示例，你已经体验了LinaPro的完整AI原生开发闭环：

关键特点：

  • 人类只负责方向和决策，不手动编写任何代码
  • AI保证实现与文档的一致性，规范和代码始终同步更新
  • 每次迭代都有完整记录，架构不会随时间漂移
  • 插件采用松耦合设计，可以随时单独禁用或卸载，不影响其他模块

接下来，你可以阅读组件设计建立整体组件地图，再深入查看源码插件、WASM动态插件和主框架服务等页面，理解框架的扩展方式和架构边界。