使用Taro开发鸿蒙原生应用——快速上手，鸿蒙应用开发指南

导读

本指南为开发者提供了使用 Taro 框架开发鸿蒙原生应用的快速入门方法。Taro，作为一个多端统一开发框架，让开发者能够使用一套代码同时适配多个平台，包括鸿蒙系统。文章将详细介绍如何配置开发环境，以及如何利用 Taro 的特性和组件库来构建鸿蒙应用。从基本的项目设置到复杂的应用逻辑开发，本文将一步步引导开发者了解 Taro 在鸿蒙应用开发中的实际应用，快速掌握跨平台开发的技巧。

01 前言

在今年的敏捷团队建设中，我通过Suite执行器实现了一键自动化单元测试。Juint除了Suite执行器还有哪些执行器呢？由此我的Runner探索之旅开始了！

随着鸿蒙系统的不断完善，许多应用厂商都希望将自己的应用移植到鸿蒙平台上。最近，Taro 发布了 v4.0.0-beta.x 版本，支持使用 Taro 快速开发鸿蒙原生应用，也可将现有的小程序转换为鸿蒙原生应用。本文将正式为开发者提供一份完整的鸿蒙应用开发指南，帮助大家使用 Taro 开发自己的第一个鸿蒙应用。

02 环境配置

首先要准备鸿蒙运行所需的环境，根据参考文档提示的步骤在 HUAWEI DevEco Studio 的 IDE 中完成 MyApplication 项目的创建，熟悉鸿蒙开发者工具的预览查看等功能。

步骤 1：安装、配置 DevEco Studio

1.登录 HarmonysOS 应用开发门户，点击右上角注册按钮，注册开发者帐号；

2.进入 HUAWEI DevEco Studio 套件货架中心，申请白名单，由于目前最新版本的 OpenHarmony SDK 和 IDE 仍未对外开发，因此个人开发者若想尝鲜，需要先申请白名单成为合作伙伴后才能继续进行下面的步骤；

3.白名单申请通过后，进入货架，下载 IDE 版本为 DevEco Studio 4.0.3.700 的 DevEcoStudio4.0-API10 开发套件；

4.下载完成后，打开 IDE 安装包进行安装，安装成功后启动 DevEco Studio，根据引导解压套件里附带的 SDK 压缩包，并根据引导在 IDE 中配置好 SDK 的使用路径；

5.SDK 配置成功后，看到设置面板中各个 SDK 的版本号与下面的图片中相同，则标识配置成功了。

步骤 2：创建 Harmony 主项目

1.创建新项目，选择需要开发的设备，然后 Mode 选择 Stage 模型，Compile SDK 选择 4.0.0(API 10)，按照引导操作后一个新的项目就被创建出来了；

2.关注目录 entry/src/main/ets/pages/Index.ets 下面的文件，熟悉文件结构。pages 目录下为页面入口，新建项目的页面目录会包含若干个 .ets 文件，应用级配置信息位于 build-profile.json5，当前的模块信息、编译信息配置项位于 entry/build-profile.json5。项目结构详情；

3.创建好项目后，根据配置插件指引，将下载的套件附带的插件配置在项目配置中。

步骤 3：预览 & 调试

DevEco Studio 目前只支持在华为提供的测试真机上进行预览与调试，模拟器调试将在不久后支持。

1. 预览：

用户真机与电脑相连，打开开发者模式，即可在真机看到效果。这里需要注意的是，真机需要使用华为侧提供的测试机，测试机中会安装纯鸿蒙的系统镜像，能够体验到完整的鸿蒙系统功能，纯鸿蒙应用目前还不能完美地在 HarmonyOS 4.0 的商用机侧跑起来。

2. 调试：

链接上真机后，选择好对应的入口模块，在项目代码中打上断点等信息，在编译器中启动调试即可。

03 Taro开发流程

步骤 1：安装 Taro v4.0.0-beta.x

1. 安装 CLI

安装 v4.0.0-beta.x 版本的 Taro CLI：

npm i -g @tarojs/cli@beta

2. 安装项目依赖

如您是新项目，创建项目时推荐创建编译器为 vite 的模板，若创建项目选择了 webpack 或 webpack5 的模板，则需要手动安装 vite、terser 以及 @tarojs/vite-runner。

$ npm i vite@^4.2.0
$ npm i terser@^5.4.0
$ npm i @tarojs/vite-runner@beta

旧项目需要把 package.json 文件中 Taro 相关依赖的版本修改为 ~4.0.0-beta.0，再重新安装依赖，并添加上述三个和 vite 相关的依赖。

如果安装失败或打开项目失败，可以删除 node_modules、yarn.lock、package-lock.json 后重新安装依赖再尝试。

步骤 2：安装 Taro 适配鸿蒙插件

$ npm i @tarojs/plugin-platform-harmony-ets@beta

步骤 3：修改 Taro 编译配置

config/index.ts

config = {// 配置使用插件plugins: ['@tarojs/plugin-platform-harmony-ets'],// harmony 相关配置harmony: {// 将编译方式设置为使用 Vite 编译compiler: 'vite',// 【必填】鸿蒙主应用的绝对路径，例如：projectPath: path.resolve(process.cwd(), '../MyApplication'),// 【可选】HAP 的名称，默认为 'entry'hapName: 'entry',// 【可选】modules 的入口名称，默认为 'default'name: 'default',},
}

步骤 4：修改鸿蒙主项目的权限配置

根据项目需要在鸿蒙主项目 entry/src/main/module.json5 中所需要使用到的机器权限。


{//..."requestPermissions": [{"name": "ohos.permission.VIBRATE"},{"name": "ohos.permission.GET_WIFI_INFO"},{"name": "ohos.permission.GET_NETWORK_INFO"},{"name": "ohos.permission.SET_NETWORK_INFO"},{"name": "ohos.permission.INTERNET"},{"name": "ohos.permission.GET_BUNDLE_INFO"},{"name": "ohos.permission.LOCATION"},{"name": "ohos.permission.APPROXIMATELY_LOCATION"},{"name": "ohos.permission.LOCATION_IN_BACKGROUND"}]
}

步骤 5：编译运行

在 package.json 里添加以下的 scripts 命令，运行命令，Taro 可将打包结果生成到配置的鸿蒙主项目路径中。

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

步骤 6：预览 & 调试

开发者可根据上面运行鸿蒙 demo 项目的方式进行预览与调试。

04 注意事项

1. 样式

布局

鸿蒙没有实现盒子模型，因此目前在实现上是使用鸿蒙的 Flex 和 Column 实现的。

尺寸单位

目前 Taro 转鸿蒙支持使用 px、vw、vh 作为数据的单位，诸如 rem、em 等单位则暂时不支持。

2. 调试

真机调试

当前，真机调试需要使用华为侧提供的测试机，测试机中会安装纯鸿蒙的系统镜像，能够体验到完整的鸿蒙系统功能，纯鸿蒙应用目前还不能完美地在 HarmonyOS 4.0 的商用机侧跑起来。

SDK 版本问题

由于鸿蒙侧迭代 SDK 的速度较快，目前 Taro 适配的 SDK 版本为最新的 API 10 版本，对于 API 版本为 9 的鸿蒙项目可能会存在组件和 API 的不兼容和不支持。

3. 与小程序的差异

当下，虽然 Taro 适配鸿蒙 ArkTS 的工作已经基本完成，但在适配过程中，我们也发现了一些暂时无法解决或者计划后续解决的遗留问题。

组件和 API

由于鸿蒙平台和小程序平台本身就存在着较大的差异，因此一些小程序的组件和 API 规范，在鸿蒙平台会没有办法重新实现，如与登录和账号信息相关的 API 以及 live-player 等和直播相关的组件。

样式解析存在一定的限制

由于在 ArkTS 中，会使用声明式 UI 来对 UI 的样式进行描述，因此不存在 sass 和 css 等样式文件，因此 Taro 在适配鸿蒙 ArkTS 时，会在编译时去解析这些样式文件。并将这些样式以内联的方式写入到组件的 TS/JS 代码中。

正常的样式基于 W3C 规范，存在着类名级联和样式继承的行为，由于开发者在代码中的写法各异，Taro 没有办法在编译时获取准确的节点结构以及节点类名信息，因此无法支持这两种行为。

另外，由于样式的解析是基于组件文件的纬度的，因此样式文件只能应用于被其引用的组件文件中，而不能跨文件应用，并且样式文件也只支持类选择器。

05 结语

本指南详细介绍了鸿蒙运行环境的配置、使用 Taro 开发鸿蒙应用的步骤和注意事项。我们希望，开发者们通过本指南，可以快速上手并高效开发自己的鸿蒙应用，顺利的进入到鸿蒙应用开发的新领域。

为了能让大家更好的学习鸿蒙 (OpenHarmony) 开发技术，这边特意整理了《鸿蒙 (OpenHarmony)开发学习手册》（共计890页），希望对大家有所帮助：https://qr21.cn/FV7h05

《鸿蒙 (OpenHarmony)开发学习手册》

入门必看：https://qr21.cn/FV7h05

  1. 应用开发导读(ArkTS)
  2. ……

HarmonyOS 概念：https://qr21.cn/FV7h05

  1. 系统定义
  2. 技术架构
  3. 技术特性
  4. 系统安全

如何快速入门？：https://qr21.cn/FV7h05

  1. 基本概念
  2. 构建第一个ArkTS应用
  3. 构建第一个JS应用
  4. ……

开发基础知识：https://qr21.cn/FV7h05

  1. 应用基础知识
  2. 配置文件
  3. 应用数据管理
  4. 应用安全管理
  5. 应用隐私保护
  6. 三方应用调用管控机制
  7. 资源分类与访问
  8. 学习ArkTS语言
  9. ……

基于ArkTS 开发：https://qr21.cn/FV7h05

1.Ability开发
2.UI开发
3.公共事件与通知
4.窗口管理
5.媒体
6.安全
7.网络与链接
8.电话服务
9.数据管理
10.后台任务(Background Task)管理
11.设备管理
12.设备使用信息统计
13.DFX
14.国际化开发
15.折叠屏系列
16.……

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：http://www.rhkb.cn/news/258694.html

如若内容造成侵权/违法违规/事实不符，请联系长河编程网进行投诉反馈email:809451989@qq.com，一经查实，立即删除！

相关文章

如何在CSS中实现背景图片的渐变？

如何在CSS中实现背景图片的渐变？

--引言 在CSS中，实现背景图片的渐变通常需要使用linear-gradient或者radial-gradient函数，这些函数可以与背景图像一起使用来创建渐变效果。然而，CSS的渐变并不直接支持使用图像作为渐变的颜色停止点。但你可以通过一些技巧来实现类似的效果…
阅读更多...
软件工程师，超过35岁怎么办

软件工程师，超过35岁怎么办

概述 随着科技行业的飞速发展，软件开发工程师的职业道路充满了各种机遇和挑战。对于已经在这个行业摸爬滚打了十多年的软件开发工程师来说，当他们步入35岁这个年纪时，可能会感到一些迷茫和焦虑。许多人担忧，在以创新、活力、快速迭…
阅读更多...
代码随想录刷题笔记 DAY 28 | 复原 IP 地址 No.93 | 子集 No.78 | 子集 II No.90

代码随想录刷题笔记 DAY 28 | 复原 IP 地址 No.93 | 子集 No.78 | 子集 II No.90

文章目录 Day 2801. 复原 IP 地址（No. 93）1.1 题目1.2 笔记1.3 代码 02. 子集（No. 78）2.1 题目2.2 笔记2.3 代码 03. 子集 II（No. 90）3.1 题目3.2 笔记3.3 代码 Day 28 01. 复原 IP 地址（No. 9…
阅读更多...
Arrays工具类的常见方法总结

Arrays工具类的常见方法总结

一、Arrays.asList( ) 1、作用 Arrays.asList( )可以将一个数组以集合的形式传入一个集合对象。通常用来将一组元素全部添加到集合中。 2、参数及返回值 参数&#xff1a;一组动态参数 返回值&#xff1a;List<T>集合 3、应用举例 List<String> boyListArra…
阅读更多...
【知识整理】产研中心岗位评定标准之大数据岗位

【知识整理】产研中心岗位评定标准之大数据岗位

为贯彻执行集团数字化转型的需要,该知识库将公示集团组织内各产研团队不同角色成员的职务“职级”岗位的评定标准; 一、定级定档目的 通过对公司现有岗位及相应岗位员工的工作能力、工作水平进行客观公正评定,确定各岗位的等级及同等级岗位员工对应的档级,从而为员工以后的晋升…
阅读更多...
WordPress站点如何实现发布文章即主动推送到百度快速收录和普通收录？

WordPress站点如何实现发布文章即主动推送到百度快速收录和普通收录？

我们在WordPress后台成功发布文章之后&#xff0c;如果靠搜索引擎来抓取的话&#xff0c;可能会比较慢&#xff0c;所以十分有必要将我们成功发布的文章马上提交到百度、必应等搜索引擎中。下面boke112百科就跟大家说一说WordPress站点如何实现发布文章即主动推送到百度快速收录…
阅读更多...
函数、极限、连续——刷题（5

函数、极限、连续——刷题（5

目录 1.题目&#xff1a;2.解题思路和步骤&#xff1a;3.总结&#xff1a;小结&#xff1a; 1.题目&#xff1a; 2.解题思路和步骤&#xff1a; 首先可能想到的是答案为0&#xff0c;但是不可以把 直接化简为n 这里要用到分子分母的平方差&#xff0c;sin^2的周期为π&#x…
阅读更多...
【知识整理】招人理念、组织结构、招聘

【知识整理】招人理念、组织结构、招聘

1、个人思考 几个方面&#xff1a; 新人&#xff1a;选、育、用、留 老人&#xff1a;如何甄别&#xff1f; 团队怎么演进&#xff1f; 有没有什么注意事项 怎么做招聘&#xff1f; 2、 他人考虑 重点&#xff1a; 1、从零开始&#xff0c;讲一个搭建团队的流程 2、标…
阅读更多...
【Anaconda】conda创建、删除、查看虚拟环境，安装pytorch

【Anaconda】conda创建、删除、查看虚拟环境，安装pytorch

1.删除环境 首先退出现有的环境 conda deactivate然后查看要删除的环境名称与路径 conda env list接下来就可以删除环境了 有两种方法 方法1&#xff1a; conda env remove -p 要删除的虚拟环境路径对我来说就是&#xff1a; conda env remove -p D:\Anaconda3\envs\MVDet…
阅读更多...
生活篇——华为手机去除负一屏

生活篇——华为手机去除负一屏

华为手机去除如下图的恶心负一屏 打开华为的应用市场app 进入&#xff1a;我的-设置-国家/地区&#xff08;改为俄罗斯&#xff09;-进入智慧助手检查更新并更新智慧助手。 然后重复开始的操作&#xff0c;将地区改回中国&#xff0c;这样就没有负一屏了。
阅读更多...
Linux platform tree下的单总线驱动程序设计（DHT11）

Linux platform tree下的单总线驱动程序设计（DHT11）

目录 概述 1 认识DHT11 1.1 DHT11特性 1.2 DHT11数据格式 1.3 DHT11与MCU通信 1.4 DHT11信号解析 1.4.1 起始信号 1.4.2 解析信号0 1.4.3 解析信号1 2 驱动开发 2.1 硬件接口 2.2 更新设备树 2.2.1 添加驱动节点 2.2.2 编译.dts 2.2.3 更新板卡中的.dtb 2.3 驱…
阅读更多...
linux系统zabbix监控配置钉钉告警

linux系统zabbix监控配置钉钉告警

zabbix配置钉钉告警 配置钉钉告警环境准备配置钉钉脚本文件钉钉日志目录编写脚本浏览器配置钉钉告警中文消息告警模版为用户添加报警媒介添加监控项》添加触发器》 添加玩监控项和触发器后添加动作 配置钉钉告警 环境准备 创建钉钉内部群创建自定义机器人记录加签地址和webho…
阅读更多...
C++-手把手教你模拟实现string

C++-手把手教你模拟实现string

1.string的成员变量 模拟实现string只需要三个成员变量&#xff0c;capacity&#xff0c;size&#xff0c;_str&#xff0c;也就是容量&#xff0c;数据大小&#xff0c;指向字符串的指针。 2.string的构造函数 2.1 使用字符串构造 使用字符串来构造一个string类的对象&…
阅读更多...
Jmeter接口测试实战篇：10分钟学会Jmeter的用法

Jmeter接口测试实战篇：10分钟学会Jmeter的用法

一提到接口测试&#xff0c;通常大家会有这样的疑问&#xff1a;前端测试不是已经覆盖到各种业务逻辑了吗&#xff1f;为什么还要做接口测试&#xff0c;接口测试和前端测试是不是重复了&#xff1f;对于这个问题&#xff0c;可以从下面几个方面来解释&#xff1a; 什么是接口…
阅读更多...
我的NPI项目之Android USB 系列(一) - USB的发展历史

我的NPI项目之Android USB 系列(一) - USB的发展历史

设计目的 USB was designed to standardize the connection of peripherals to personal computers, both to exchange data and to supply electric power. 一个是为了标准化电脑连接外设的方法。 能够支持电脑和外设的数据交互和&#xff08;对外&#xff09;供电。 目前已…
阅读更多...
【Linux】程序地址空间 -- 详解 Linux 2.6 内核进程调度队列 -- 了解

【Linux】程序地址空间 -- 详解 Linux 2.6 内核进程调度队列 -- 了解

一、程序地址空间回顾 在学习 C/C 时&#xff0c;我们知道内存会被分为几个区域&#xff1a;栈区、堆区、全局/静态区、代码区、字符常量区等。但这仅仅是在语言层面上的理解&#xff0c;是远远不够的。 如下空间布局图&#xff0c;请问这是物理内存吗&#xff1f; 不是&…
阅读更多...
【机器学习基础】决策树（Decision Tree）

【机器学习基础】决策树（Decision Tree）

&#x1f680;个人主页&#xff1a;为梦而生~ 关注我一起学习吧&#xff01; &#x1f4a1;专栏&#xff1a;机器学习 欢迎订阅&#xff01;后面的内容会越来越有意思~ ⭐特别提醒&#xff1a;针对机器学习&#xff0c;特别开始专栏&#xff1a;机器学习python实战 欢迎订阅&am…
阅读更多...
LEETCODE 164. 破解闯关密码

LEETCODE 164. 破解闯关密码

class Solution { public:string crackPassword(vector<int>& password) {vector<string> password_str;for(int i0;i<password.size();i){password_str.push_back(to_string(password[i]));}//希尔排序int gappassword.size()/2;while(gap>0){for(int i…
阅读更多...
【机器学习案例3】从科学论文图片中提取标题、作者和摘要【含源码】

【机器学习案例3】从科学论文图片中提取标题、作者和摘要【含源码】

在这个项目中，我的目标是从科学论文图片中提取某些部分（标题、作者和摘要）。预期提取部分是科学论文中常见的部分，例如标题、摘要和作者。输入与最终结果。我的输入是将第一页纸转换成图像。最终结果是一个 txt 文件，其中包含标题、作者和摘要部分，如下图1和图2所示。我将…
阅读更多...
线索化二叉树（先序，中序，后序）+线索化二叉树的遍历【java详解】

线索化二叉树（先序，中序，后序）+线索化二叉树的遍历【java详解】

目录 线索化二叉树的基本介绍&#xff1a; 举个栗子&#xff1a; 二叉树的中序线索化&#xff1a; 创建HeroNode类&#xff0c;表示节点信息&#xff1a; 编写中序线索化方法代码&#xff1a; 中序线索化遍历代码&#xff1a; 测试代码&#xff1a; 测试结果&#xff1a…
阅读更多...
最新文章
推荐文章

Copyright @ 2022~2023

友情链接： 我的编程经验分享 一条长河网 尧图网站开发