[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"article-31":3,"comments-31":34},{"id":4,"title":5,"summary":6,"cover":7,"author":8,"tags":13,"viewCount":26,"likeCount":27,"collectCount":27,"commentCount":27,"status":28,"publishedAt":29,"contentMd":30,"contentHtml":31,"likedByMe":32,"collectedByMe":32,"updatedAt":33},31,"AI + Vue 3：从需求到完整功能，如何让 Agent 一次把活干完","不要让 AI 写代码，让 AI 完成任务。","https:\u002F\u002Fdevshare-assets.oss-cn-guangzhou.aliyuncs.com\u002Fuploads\u002F2026\u002F09\u002Fefae8e65-3bd2-4f7b-9fd2-10134d61ecda.png",{"id":9,"username":10,"avatar":11,"bio":12},1,"DevShareAdmin","https:\u002F\u002Fdevshare-assets.oss-cn-guangzhou.aliyuncs.com\u002Fuploads\u002F2026\u002F09\u002F98609a86-e08d-437b-b921-1291fc5a1b4d.jpg","DevShare（技享）官方账号",[14,18,22],{"id":15,"name":16,"slug":17},3,"人工智能","ai",{"id":19,"name":20,"slug":21},2,"前端","frontend",{"id":23,"name":24,"slug":25},4,"Vue","vue",40,0,"published","2026-09-16T16:08:55.888Z","一、从代码思维转向 Task 思维\n\n需求：\n\n```text\n开发用户管理模块\n```\n\nAgent 可以自动拆解：\n\n```text\n① 分析项目\n\n② 找现有 Table\n\n③ 找 API 模式\n\n④ 找分页组件\n\n⑤ 创建页面\n\n⑥ 创建 API\n\n⑦ 添加类型\n\n⑧ 添加 Loading\n\n⑨ 添加 Error\n\n⑩ 添加测试\n\n⑪ pnpm lint\n\n⑫ pnpm type-check\n\n⑬ Git Diff Review\n```\n\n核心变化：\n\n> **AI 提效的最小单位不是代码，而是 Task。**\n\n## 二、一个好的 Task 应该包含什么？\n\n```text\n目标\n ↓\n上下文\n ↓\n约束\n ↓\n输入\n ↓\n输出\n ↓\n验证标准\n```\n\n例如：\n\n```text\n目标：\n新增用户管理页面。\n\n上下文：\n项目使用 Vue3 + TypeScript + Ant Design Vue。\n\n约束：\n优先复用现有组件和 API 模式。\n\n输出：\n页面、API、类型、测试。\n\n验证：\nlint + type-check + 单元测试。","\u003Cp>一、从代码思维转向 Task 思维\u003C\u002Fp>\n\u003Cp>需求：\u003C\u002Fp>\n\u003Cpre>\u003Ccode class=\"language-text\">开发用户管理模块\n\u003C\u002Fcode>\u003C\u002Fpre>\n\u003Cp>Agent 可以自动拆解：\u003C\u002Fp>\n\u003Cpre>\u003Ccode class=\"language-text\">① 分析项目\n\n② 找现有 Table\n\n③ 找 API 模式\n\n④ 找分页组件\n\n⑤ 创建页面\n\n⑥ 创建 API\n\n⑦ 添加类型\n\n⑧ 添加 Loading\n\n⑨ 添加 Error\n\n⑩ 添加测试\n\n⑪ pnpm lint\n\n⑫ pnpm type-check\n\n⑬ Git Diff Review\n\u003C\u002Fcode>\u003C\u002Fpre>\n\u003Cp>核心变化：\u003C\u002Fp>\n\u003Cblockquote>\n\u003Cp>\u003Cstrong>AI 提效的最小单位不是代码，而是 Task。\u003C\u002Fstrong>\u003C\u002Fp>\n\u003C\u002Fblockquote>\n\u003Ch2>二、一个好的 Task 应该包含什么？\u003C\u002Fh2>\n\u003Cpre>\u003Ccode class=\"language-text\">目标\n ↓\n上下文\n ↓\n约束\n ↓\n输入\n ↓\n输出\n ↓\n验证标准\n\u003C\u002Fcode>\u003C\u002Fpre>\n\u003Cp>例如：\u003C\u002Fp>\n\u003Cpre>\u003Ccode class=\"language-text\">目标：\n新增用户管理页面。\n\n上下文：\n项目使用 Vue3 + TypeScript + Ant Design Vue。\n\n约束：\n优先复用现有组件和 API 模式。\n\n输出：\n页面、API、类型、测试。\n\n验证：\nlint + type-check + 单元测试。\u003C\u002Fcode>\u003C\u002Fpre>\n",false,"2026-10-09T16:00:00.047Z",{"items":35,"nextCursor":36},[],null]