开yun体育网 ... rn: {...}-开云·kaiyun(全站)体育官方网站/网页版 登录入口

发布日期：2025-12-12 05:23    点击次数：200

确立鸿蒙环境开yun体育网

下载装置 DevEco

确立IDE

绽开 Prefreences, OpenHarmony SDK, 勾选 API Version 12

创建鸿蒙技俩

绽开 DevEco，点击 右上角Create Project， 在 Application 处摄取 Empty Ablity, 点击 Next, 插足确立页，凭证需求调遣本色，这里使用默许确立，

Project name: MyApplication,Bundle name: com.example.myapplication,Save location 摄取需要创建的目次，这里使用 MyApplication 目次 （~/projects/MyApplication)Compatible SDK, 摄取 4.0.0Module name: entry

贵重，上头刻下 Taro 相沿的 SDK 版块为 4.0.0

点击 Finish 完成技俩创建。

装置 Taro 4.x

yarn global add @tarojs/cli

装置成功后查验 taro 是否成功

➜ ~ taro --version Taro v4.0.74.0.7

运行化技俩

taro init taro-ohos

按照请示输入，这里使用以下确立

? 请输入技俩先容 taro ohos? 请摄取框架 React? 是否需要使用 TypeScript ？ Yes? 请摄取 CSS 预处理器（Sass/Less/Stylus） Sass? 请摄取包解决器具 yarn? 请摄取编译器具 Vite? 请摄取模板源 Gitee（最快）✔ 拉取云尔模板仓库成功！? 请摄取模板 默许模板

恭候技俩创建成功，直到输出以下请示：

Done in 44.95s.✔ 装置技俩依赖成功创建技俩 taro-ohos 成功！请插足技俩目次 taro-ohos 脱手职责吧！

装置鸿蒙插件

yarn add @tarojs/plugin-platform-harmony-etsyarn add path

修改编译确立

找到 config/index.ts 文献, 在 plugin 处添加 @tarojs/plugin-platform-harmony-ets, 在 rn 下方添加 harmony 确立：

import path from 'path'... ... plugins: [ '@tarojs/plugin-platform-harmony-ets' ], ... rn: {...}, harmony: { // 将编译形状确立为使用 Vite 编译 compiler: 'vite', // 【必填】鸿蒙主欺诈的完全旅途，举例： projectPath: path.resolve(process.cwd(), '../MyApplication'), // 【可选】HAP 的称呼，默许为 'entry' hapName: 'entry', // 【可选】modules 的进口称呼，默许为 'default' name: 'default', }

贵重这里要把 projectPath 确立成 Deveco 创建的鸿蒙技俩目次

修改 package.json

在 scripts 处添加以下确立

"scripts": { ... "build:harmony": "taro build --type harmony", "dev:harmony": "npm run build:harmony -- --watch"}

运行 Taro 技俩

yarn run dev:harmony

适度台输出以下本色，显露构建成功：

build started... 点击检验齐备输出

yarn run v1.22.22$ npm run build:harmony -- --watch> taro-ohos@1.0.0 build:harmony> taro build --type harmony --watch Taro v4.0.7watching for file changes...build started...✓ 7 modules transformed.rendering chunks (6)...脱手 ohpm install 剧本实行...install completed in 0s 36ms实行 ohpm install 剧本成功。../MyApplication/entry/src/main/ets/app.scss.xss.js 0.10 kB │ gzip: 0.10 kB │ map: 0.10 kB../MyApplication/entry/src/main/ets/index.scss.xss.js 0.10 kB │ gzip: 0.10 kB │ map: 0.10 kB../MyApplication/entry/src/main/ets/app_comp.js 0.27 kB │ gzip: 0.21 kB │ map: 0.70 kB../MyApplication/entry/src/main/ets/pages/index/index_taro_comp.js 0.40 kB │ gzip: 0.27 kB │ map: 0.11 kB../MyApplication/entry/src/main/ets/app_taro_comp.js 0.83 kB │ gzip: 0.46 kB │ map: 0.13 kB../MyApplication/entry/src/main/ets/pages/index/index_comp.js 0.89 kB │ gzip: 0.42 kB │ map: 0.99 kB../MyApplication/entry/src/main/ets/app.ets 2.21 kB │ gzip: 0.86 kB../MyApplication/entry/src/main/ets/render.ets 5.76 kB │ gzip: 1.23 kB../MyApplication/entry/src/main/ets/pages/index/index.ets 9.04 kB │ gzip: 2.44 kBbuilt in 2489ms.

Taro 会将编译好的文献输出至鸿蒙技俩目次

运行鸿蒙

确立欺诈签名

绽开 File -> Project Structure..., 点击 Siging Configs, Sign In, 举例华为账号，点击右下角 Apply, OK, 完成签名

运行

在 DevEcho 中，点击运行按钮，待适度台实行完成，检验确立上，页面中将输出以下本色

```bash 首页

Hello world! ```

贵重事项

指令 Taro 时报错 throw new Error(不存在编译平台 ${platform})，config/index.ts文献中莫得添加 @tarojs/plugin-platform-harmony-ets

参考贵寓

鸿蒙 & OpenHarmony开yun体育网