首页 > 编程语言 >Taro首个支持鸿蒙的 UI 库,同时还兼容 React Native、小程序、H5

Taro首个支持鸿蒙的 UI 库,同时还兼容 React Native、小程序、H5

时间:2024-11-19 10:08:17浏览次数:1  
标签:Taro 鸿蒙 兼容 React UI duxapp Native

Taro 4.0 已经推出一段时间了,4.0 版本主要是支持了鸿蒙端的开发以及 Vite 编译工具的支持。duxapp 在这段时间也跟随 Taro 的脚步,实现的对鸿蒙端的支持,并且也将之前的 duxui 这个多端的 UI 库,对鸿蒙端实现了兼容。

duxui 组件库提供了 60+ 的组件支持,能快速帮助你完成业务。

现在使用这个 UI 库,不仅能开发鸿蒙,还能实现同时开发 React Native、小程序和 H5,也是目前唯一一个能兼容这么多端的 UI 库。

组件展示

效果图

如何使用

使用下面的命令,可以快速初始化一个 UI 库的示例项目,你可以通过这个示例项目快速的查看到 UI 库在鸿蒙端以及其他端的效果

npx duxapp-cli create projectExample duxuiExample
  • 提示:在这之前需要安装好基本的环境 nodejs 20+ yarn git

创建项目后,进入项目目录 projectExample 运行以下命令

yarn dev:harmony --app=duxuiExample

编译完成后,使用 DevEco Studio 打开 dist/harmony 目录,这个目录就是一个原生鸿蒙项目

  • 如果你还不了解鸿蒙开发基础知识,或者想继续深入了解如何开发,可以查看这篇入门教程

duxapp 做了些什么

自动化

在 duxapp 中,我们把鸿蒙工程模板做了封装,就像 React Native 端那样,你不需要自行创建项目工程文件,在你运行鸿蒙相关的命令的时候,会自动创建鸿蒙工程项目,你需要做的就是使用 DevEco Studio 来继续编译 duxapp 生成的鸿蒙工程文件

配置化

包名、版本等信息就和 React Native 端那样,通过配置文件来实现

模块化

我们将鸿蒙端的支持封装到了 duxapp 的一个模块 duxappHarmony 中,只要你依赖了这个模块,就能实现对鸿蒙端的兼容

如果你还不是很了解 duxapp 的模块化,可以查看模块化介绍

UI组件库

在过去这一段时间的兼容过程中,主要做的工作就是对 UI 库的兼容,因为鸿蒙的 arkui 和 Web 标准对比,存在不小的差异,每个组件都需要进行适配,并且还需要对一些底层代码进行修改。总得来说,现阶段虽然还存在一些小问题,但是95%的功能已经实现兼容

继续

如果你对这个项目有兴趣,可以查看文档,继续了解详情

开发文档:http://duxapp.cn

GitHub:https://github.com/duxapp

标签:Taro,鸿蒙,兼容,React,UI,duxapp,Native
From: https://www.cnblogs.com/shaogong/p/18554330

相关文章

  • IPC-7095E-2024 EN Design and Assembly Process Guidance for Ball Grid Arrays (BGA
    IPC-7095E-2024ENDesignandAssemblyProcessGuidanceforBallGridArrays(BGAs).pdf链接: https://pan.baidu.com/s/1l20O_ojtNxp3RlB7qDwZCw?pwd=1234 提取码:1234https://share.weiyun.com/msvouwaFIPC-7095E BGA设计与组装工艺的实施Industry:1.PCBFabricator......
  • Vue+ElementUI 导出为PDF文件
    在ElementUI中导出PDF通常涉及将页面上的DOM元素转换为PDF格式的文件。这一过程可以通过结合使用 html2canvas 和 jsPDF 这两个JavaScript库来实现。步骤:1、安装依赖在项目中安装html2canvas和jsPDF这两个库。可以通过npm进行安装:npminstallhtml2canvasjspdf2、创建......
  • 如何在 Ubuntu 上安装 Mosquitto MQTT 代理
    如何在Ubuntu上安装MosquittoMQTT代理Mosquitto是一个开源的消息代理,实现了消息队列遥测传输(MQTT)协议。在Ubuntu22.04上安装MQTT代理,您可以利用MQTT轻量级的TCP/IP消息平台,该平台专为资源有限的物联网(IoT)设备设计,例如带宽低或电池寿命短的设备。Mos......
  • 用pip进行安装时提示“Package requires a different Python: 3.8.10 not in ‘>=3.9‘
    用pip进行安装时提示“PackagerequiresadifferentPython:3.8.10notin'>=3.9'“报错“Package'dpgen-0.12.2.dev1-g6943db5'requiresadifferentPython:3.8.10notin'>=3.9'”修改pip关联的python版本way1修改pip关联的python版本way2报错“Package‘......
  • 一文带你快速上手 UniApp 组件与 uni-ui
    深入了解UniApp组件与组件框架uni-ui在UniApp的开发中,组件化编程是提升开发效率和应用可维护性的重要手段。通过组件化,开发者可以将应用的不同功能模块进行封装,使得代码更加简洁、可重用,并且可以提升开发体验和效率。本文将重点介绍UniApp的组件及其常用组件框架uni-ui,......
  • 人工智能之图像预处理、数据库、GUI布局的综合应用(数据库部分、GUI布局设计)
    文章目录前言一、数据库创建数据表查询:修改、删除GUI布局成果展示进行图像处理和车牌识别:查询记录:总结前言之前进行opencv项目的编写,我们成功写出了智能车牌识别系统(初学版)以下对数据库和GUI布局设计部分进行补充,对于知识点和基本补充部分可以翻看我之前的笔记,......
  • BurpSuite功能介绍
    BurpSuite一共包含13个功能模块,它们帮助渗透测试人员更好地了解目标应用的整体状况、当前的工作涉及哪些目标、攻击面等信息。BurpSuiteTarget主要包含站点地图、目标域、Target工具域并分析可能存在的漏洞。BurpSuiteSpider主要用于大型的应用系统测试,它能在很短时间内帮......
  • 【Android、IOS、Flutter、鸿蒙、ReactNative 】绘制空心圆圈
    Androidjava绘制圆圈自定义CircleViewpackagecom.java.circle;importandroid.content.Context;importandroid.graphics.Canvas;importandroid.graphics.Paint;importandroid.view.View;publicclassCircleViewextendsView{privatePaintpaint;......
  • 基于yolov8、yolov5的玉米病害检测识别系统(含UI界面、训练好的模型、Python代码、数据
    项目介绍项目中所用到的算法模型和数据集等信息如下:算法模型:  yolov8、yolov8+SE注意力机制或yolov5、yolov5+SE注意力机制,直接提供最少两个训练好的模型。模型十分重要,因为有些同学的电脑没有GPU,无法自行训练。数据集:  网上下载的数据集,格式都已转......
  • toolchain build host target
    一个程序开发完成以后,对源代码进行编译,将编译后的文件发布出去形成所谓的各个平台的安装版本(非开源的都是这么干的,开源的也可以这样编译后不同运行平台的编译版本),这就是所谓的交叉编译。下面介绍有关这平台相关性的选项。  --build=BUILD  configureforbuildingonBU......