ARTICLE DETAIL

资讯详情

深耕郑州网站建设与运营推广的一线实战洞察。

华为云码道接入 DevEco CLI 鸿蒙应用开发AICoding

华为云码道接入 DevEco CLI 鸿蒙应用开发AICoding 华为云码道接入 DevEco CLI 鸿蒙应用开发AICoding一、前言让 AI 写一张登录页需求可以很直观页面上有应用名、手机号、密码和登录按钮。但一张看起来像登录页的图还没有回答几个开发问题输入值由谁保存密码切换成明文后是否还在空输入如何提示用到的 ArkUI API 是否适用于项目的 SDK这篇文章以虚构应用“云栖生活”为例把华为云码道 CodeArts Agent 的项目技能与 DevEco CLI 接起来。目标是让 Agent 沿着“读取官方文档—生成规格—修改 ArkTS—构建工程”的顺序工作。码道负责理解任务、规划与修改代码DevEco CLI 提供鸿蒙开发工具入口。华为开发者联盟另外提供的 DevEco Code 是独立 Agent本文使用的客户端仍是华为云码道。1.1 华为云码道与 DevEco CLI 的关系很多人会把“AI 写代码”和“命令行工具”混为一谈。实际上它们是两层层级角色典型工作本例对应AI 智能体层华为云码道CodeArts代码智能体理解需求、生成规格、规划任务、修改代码、协调工具读取requirements/统一登录页需求.md生成feature-spec.md与test_case.md修改Index.ets调用构建工具工具链层DevEco CLI / DevEco Studio / hdc / hvigor编译、构建、签名、安装、设备管理、本地文档查询devecocli build、devecocli docs search、hvigor 构建、HAP 打包简单说码道是“大脑”DevEco CLI 是“手脚”。码道不会替代 CLI而是通过项目 Skill 和内置工具去调用 CLI。这意味着没有 DevEco CLI/Studio码道只能写静态代码无法编译、打包、安装到设备。有了 DevEco CLI/Studio码道才能把这些工具编排进一个可验证的闭环。“客户端显示 Skill 已加载”不等于“CLI 命令能执行”更不等于“构建成功”三者需要分别记录证据。1.2 本文要示范的重点本文重点不是介绍登录页怎么画而是展示一种可验证的 AI 协作方式把需求写成规格Spec再让 AI 按规格编码把文档查询、代码修改、构建结果都留下可追溯的证据把 AI 工具调用与 DevEco CLI 调用区分开避免把“AI 说成功了”当成“工程确实构建成功了”。二、两种模式Vibe Coding 与 Spec Coding在让 AI 写鸿蒙页面时实际存在两种工作模式。2.1 Vibe Coding凭感觉直接写做法给 Agent 一句自然语言比如“把 Index.ets 改成登录页”让它直接改代码。优点快一轮对话可能就出界面。缺点AI 可能凭记忆写 API不查当前 SDK 文档没有明确验收标准只能人工看截图判断对错改坏了难以追溯是需求理解错、API 用错还是构建环境错多轮迭代后代码和对话都容易失控。证据要求至少保留最终代码、构建退出码、HAP 路径。如果涉及设备验证还需截图。2.2 Spec Coding先写规格再编码做法先把需求拆成规格文档Feature Spec和测试用例Test CaseAgent 再依据规格生成代码最后按用例验证。优点需求、实现、验证三者解耦便于逐条核对Agent 在编码前必须先查文档减少凭记忆乱写测试用例成为共同验收标准避免“看起来差不多就行”后续修复或回归时规格和用例可直接复用。缺点前期需要多一步规格生成对简单一次性任务可能显得重。证据要求需求文件、规格文档、测试用例、文档查询记录、代码差异、构建报告、测试报告如有设备测试。2.3 本文采用的模式本文采用Spec Coding。原因很直接这个登录页需求来自四平台对比实验需要各平台在相同验收标准下实现如果只让 AI 直接写最终代码差异会大到无法对比。对应到本工程文件结构如下requirements/ └── 统一登录页需求.md # 原始需求人工编写四平台共用 .codeartsdoer/hmos/runs/20261007-172500/ ├── feature-request.md # 码道归一化后的请求 ├── feature-spec.md # 8 个场景的规格 ├── test_case.md # 8 个测试用例、24 条“四诚实证据”断言 ├── context-notes.md # 文档查询记录与项目上下文 ├── logic/ │ ├── commit-info.md # 代码提交/变更说明 │ ├── convergence-report.md # 构建收敛报告 │ └── entry-default-unsigned.hap # 构建产物 └── feature-dev-manifest.md # 完整流水线清单三、Spec Coding 实战从需求到 HAP3.1 环境准备让当前执行环境找到 DevEco CLI本系列使用 Windows、DevEco CLI1.3.0-stable、DevEco Studio26.0.0.821和 API 26 工程。版本是这次材料的环境记录不代表之后安装stable仍会取得同一个版本。官方快速入门给出的稳定版安装命令如下本机已经安装可以直接查版本。# 未安装时执行已经安装的读者先核对版本npm install-g deveco/deveco-clistable devecocli--version# 本文机器的 Studio 安装位置读者需替换为自己的路径$env:DEVECO_CLI_STUDIO_PATH D:\HarmonyOS\IDE\devecostudio-windows-26.0.0.821\DevEco StudioDEVECO_CLI_STUDIO_PATH指向 Studio 安装根目录不是项目目录也不是bin子目录。PowerShell 中的$env:赋值只影响当前会话及其子进程已经启动的 IDE 或另一个终端不一定取得它。后续应在 Agent 实际执行命令的环境中核对路径避免人工终端能构建、Agent 却找不到工具链。新建演示工程时可用一个独立的英文路径devecocli create--app-name LoginShowcase--bundle-name com.example.loginshowcase--api-level 26--project-pathD:\HarmonyLab\HuaweiLoginSet-Location-LiteralPathD:\HarmonyLab\HuaweiLoginD:\HarmonyLab\HuaweiLogin是读者示例路径。系列准备阶段曾遇到create拒绝含中文的工程路径因此这里采用 ASCII 路径。已有工程可以直接打开不必重复创建。项目根目录应能看到build-profile.json5页面入口是entry/src/main/ets/pages/Index.ets。3.2 把随包 Skill 放入码道的项目目录码道官方规定的本地项目技能目录是.codeartsdoer/skills/。本篇把随 DevEco CLI 安装包发布的SKILL.md放进其deveco-cli子目录让技能只服务于这个演示工程。首次安装可在工程根目录执行$projectPath(Get-Location).Path$npmGlobalRoot(npm root-g).Trim()$skillSourceJoin-Path$npmGlobalRootdeveco\deveco-cli\SKILL.md$skillDirectoryJoin-Path$projectPath.codeartsdoer\skills\deveco-cliNew-Item-ItemType Directory-Path$skillDirectory-Force|Out-NullCopy-Item-LiteralPath$skillSource-Destination(Join-Path$skillDirectorySKILL.md)最终目录应是.codeartsdoer/ └── skills/ └── deveco-cli/ └── SKILL.md当前 CLI 随包支持的 Agent 别名中没有codearts因此这里使用文件导入路线不给读者杜撰一条--agent codearts命令。文件内容也应保留官方随包版本方便与 CLI 版本对应。打开这个工程在码道设置的“技能与规则”中查看项目级技能确认deveco-cli可见且已开启然后在对话中明确要求使用该技能。确认接入时至少保留两个证据客户端显示的技能名称和状态以及 Agent 随后执行的 DevEco CLI 命令。仅列出磁盘上的文件或者 Agent 回答一句“已加载”都不足以独立核对后续调用。本机验证中码道项目级设置实际显示deveco-cli状态为启用来源为当前工程的.codeartsdoer/skills/deveco-cli。devecocli可执行文件位于D:\DevTools\npm-global\devecocli.ps1--version可正常返回1.3.0-stable。但当前执行环境下devecocli docs search子命令会异常退出因此本轮文档查询改用码道内置skillSearch完成构建则通过码道hmosBuild工具底层调用 DevEco CLI / hvigor实际执行。这个结果说明“客户端加载 Skill”“命令存在”“子命令可正常执行”和“Agent 通过工具调用 CLI”需要分别记录。3.3 写页面之前先查询官方文档DevEco CLI 的docs search和docs read是本地鸿蒙文档入口。Skill 告诉 Agent 怎样使用这些入口查到的文档再为实现提供依据。理想情况下先分别搜索输入框和密码相关内容devecocli docs search TextInput--limit 5 devecocli docs search 密码--limit 5# 把下面的占位符替换成上一步实际返回的 documentIddevecocli docs read实际返回的documentId在本机当前执行环境中devecocli docs search子命令异常退出因此 Agent 改用码道内置skillSearch完成等效查询。实际查询词与返回文档如下查询关键词文档标题 / ID用途ArkUI TextInput password type show hide icontextinput #TextInputOptions对象说明确认占位文本、输入类型、密码可见性图标ArkUI Column Row Button Text layout padding margin borderRadiusbutton #Button确认按钮组件用法ArkTS State Component state managementstate组件内状态 #State确认组件内状态管理ArkUI prompt toast showToast messageclass (promptaction) #showToast确认本地提示 API其中textinput #TextInputOptions对象说明与class (promptaction) #showToast进一步通过harmony-doc-view读取了完整内容确认TextInput支持placeholder、type(InputType)、showPasswordIcon等属性以及PromptAction.showToast的调用方式。在码道中可以先发送这段提示词请使用当前工程的 deveco-cli Skill。先核对技能名称和来源路径。 若 devecocli docs search 可正常执行请用它查找 ArkUI TextInput、密码输入及状态绑定的官方文档 若该子命令异常退出改用 skillSearch 完成等效查询。 请展示命令/查询词和返回的文档标题或 ID并选择相关条目读取。 说明本工程如何保存手机号、密码及密码显隐状态本轮先不要改代码。 若技能或文档查询不可用保留真实错误不要编造查询结果。这一步应回答的是 API 与状态使用方式不只是给出一段与项目版本无关的示例。保存文档 ID 之后后续修复也可以回到同一条资料而不必反复凭记忆猜 API。3.4 生成规格与测试用例在 Spec Coding 模式下Agent 不直接改代码而是先基于需求生成规格文档。本工程的需求是requirements/统一登录页需求.mdAgent 据此生成feature-spec.md8 个场景初始渲染、手机号输入、密码输入、显隐切换、空手机号、空密码、演示成功、视觉适配test_case.md8 个测试用例、24 条“四诚实证据”断言context-notes.md文档查询记录、项目架构说明、风险约束这一步把“登录页”从一个模糊需求变成可逐项核对的契约。例如场景四明确规定点击显隐控制后密码内容保持不变TC-004 的断言tp-015要求两次切换前后密码输入框的实际内容保持为mySecret123不变。这些断言在后续设备测试中可以直接使用即使跳过设备测试它们也明确了代码应该满足的行为。3.5 编码实现“云栖生活”登录页本系列四个平台使用相同的任务规格。页面背景为#F6F8FC主按钮为#2563EB左右边距约24vp顶部显示“云栖生活”和“欢迎回来登录后继续探索”。手机号与密码默认空密码默认隐藏底部标明“演示界面不连接真实账号服务”。本轮实际修改了entry/src/main/ets/pages/Index.ets关键状态与逻辑如下// 放在 Entry / Component 的 Index 组件内部Statephone:string;Statepassword:string;StateisPasswordVisible:booleanfalse;privateshowToast(message:string):void{this.getUIContext().getPromptAction().showToast({message:message});}privatehandleLogin():void{if(this.phone.length0){this.showToast(请输入手机号);return;}if(this.password.length0){this.showToast(请输入密码);return;}this.showToast(演示模式未连接账号服务);}手机号直接判空密码只检查长度保留用户实际输入。登录按钮调用handleLogin()通过PromptAction.showToast给出本地提示。密码显隐控制只修改isPasswordVisible不重建或重置密码值密码输入框的type绑定为this.isPasswordVisible ? InputType.Normal : InputType.Password并开启showPasswordIcon(true)让系统提供默认显隐图标。最终页面还包含顶部蓝色圆形“云”字标识、应用名“云栖生活”、副标题“欢迎回来登录后继续探索”、手机号输入区、密码输入区、胶囊样式“登录”按钮以及底部“演示界面不连接真实账号服务”文案。背景色#F6F8FC主文字#1F2937辅助文字#6B7280按钮背景#2563EB内容区左右边距24vp输入框圆角12vp。如果首轮页面已有布局可用这个小迭代继续检查 AI 的修改质量请只完善当前登录页的密码显示/隐藏行为。保留已有布局、phone与password状态。 查阅本机TextInput文档后实现显隐切换输入一段演示密码后连续切换两次 密码内容应保持不变。不要在日志、最终报告或持久化文件中输出密码内容。 请说明改了哪些状态与事件并列出检查这个行为的方法。登录页的价值在这里开始显现一张静态截图可以看布局连续切换与点击行为才能看状态是否正确。3.6 构建与收敛在工程根目录执行代码规范检查与构建且分别记录退出码。本轮实际通过码道hmosBuild工具调用 DevEco CLI / hvigor 完成构建等价命令如下# 本机实际由 hmosBuild 工具调用 devecocli / hvigor 执行# 因原工程路径含中文字符先在临时英文路径 D:\tmp\hmos-login 构建devecocli build--project D:\tmp\hmos-login--mode release--product default--modules entry$buildExitCode$LASTEXITCODEWrite-Outputbuild exit code:$buildExitCode实际构建结果字段值构建状态BUILD SUCCESSFUL退出码0HAP 路径entry\build\default\outputs\default\entry-default-unsigned.hap临时构建路径产物大小134,992 字节签名状态未签名项目未配置 signingConfigs构建警告Function may throw exceptions来自showToast调用Will skip sign hos_hap未配置签名构建期间遇到一个问题原工程路径D:\AIApplication\workspace\wppdocs\鸿蒙材料\DevEco CLI与鸿蒙自动化\四平台鸿蒙登录页_20261005\runs\huawei_codearts_agent包含中文字符和中文括号hvigor 报错00306003 Specification Limit Violation。处理办法是把工程完整复制到纯英文临时目录D:\tmp\hmos-login在那里构建成功后再将 HAP 拷回原始工程的输出目录.codeartsdoer/hmos/runs/20261007-172500/logic/。原始工程路径下的代码文件与临时路径保持一致。check lint输出规范问题及实践建议它不等同于完整语法、类型与打包验证。构建应看本次真实退出码、完整错误和新产物路径不能只看终端中出现过“success”也不能拿旧 HAP 当作这次修改的结果。需要独立的语法诊断时可以选配 DevEco CLI 内置 MCP。码道官方支持本地 stdio 服务可在其 MCP 设置中添加。码道 MCP 说明字段本文的配置思路服务名称deveco-mcp传输stdio启动程序本机 Node 可执行文件的绝对路径可用(Get-Command node).Source查询参数npm 全局包下deveco/deveco-cli/dist/cli.js的绝对路径以及serve、mcp环境PROJECT_PATH指向当前工程DEVECO_PATH指向本机 Studio 安装根本机安装包的 MCPcheck工具接受如下输入{files:[entry/src/main/ets/pages/Index.ets]}这里只采用check。其他语言工具以当前 Studio 和客户端实际暴露的列表为准项目准备完成、服务连接成功、工具真正调用是不同的记录项。Skill 不会自动开启 MCPinit --skill与init --mcp也不能写在同一条命令里。CLI 的全部命令不会因此自动变成 MCP 工具。码道在这个题材中可使用的能力是官方支持的项目技能、本地 MCP 接入口以及内置的 HarmonyOS 开发工具如hmosBuild、skillSearch。把 DevEco CLI 的使用方法放到项目技能中再把一张登录页拆成文档依据、页面状态和检查条件能让后续协作有明确起点。更重要的是要区分两种 AI 协作模式Vibe Coding适合快速验证想法但证据容易缺失Spec Coding适合需要可追溯、可对比、可回归的工程任务。
返回列表