Uni-APP+Vue3+鸿蒙 开发菜鸟流程

原创 已于 2024-11-17 10:37:46 修改 · 1.1k 阅读 · 5 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
文章标签：

#uni-app #鸿蒙

于 2024-11-17 10:23:12 首次发布

参考文档

文档中心

运行和发行 | uni-app官网

AppGallery Connect

DCloud开发者中心

环境要求

  1. Vue3
  2. jdk 17 Java Downloads | Oracle 中国 【鸿蒙开发工具内置jdk17，本地不使用17会报jdk版本不一致问题】

  •  开发工具

  1. HBuilder
  2. DevEco Studio【目前只下载这一个就行】 下载中心 | 华为开发者联盟-HarmonyOS开发者官网，共建鸿蒙生态

DevEco Studio配置

创建一个空白项目

【主要为了生成签名】

创建鸿蒙模拟器

启动模拟器

生成签名

生成签名

签名拷贝到HBuilder

如果用Vue开发则将红框中的内容拷贝到Hbuilder中

HBuiler配置

新建vue3项目

运行到鸿蒙

DevEco的执行文件路径

签名信息同步

将DevEco 生成的签名更新到HBuilder项目中

配置完成再次运行到鸿蒙会出现如下页面【内容不一样，仅供演示使用】

Defry
关注
uniapp+vue3+鸿蒙系统的开发
浩星
07-16 2038
 uniapp+vue3+鸿蒙系统的开发
鸿蒙开发-ArkUI封装interface接口+自定义组件(菜鸟学习01)
a1009698473的博客
04-30 1219
提示：首先，定义了一个Item接口来描述商品的数据结构，这有助于提高代码的可读性和可维护性。
鸿蒙开发-状态管理器@State：对象数组的增删及属性更新(菜鸟学习02)
a1009698473的博客
05-08 4451
在鸿蒙HarmonyOS应用开发中，@State装饰器是管理组件状态的重要工具，尤其在处理对象数组时，它能确保UI与数据模型的同步更新。本文档将深入探讨如何利用@State有效地执行对象数组的增删操作以及属性更新，确保状态变化的正确反映。
Vue3版本的uniapp项目运行至鸿蒙系统
kjprime的博客
11-04 1012
注意，先将HbuilderX升级至最新版本，这样才支持鸿蒙系统的调试与运行；按照如下图片点击，快速升级皆可。
Vue学习之使用HBuilderX创建并使用vue3.0项目
qq_38527427的博客
02-01 8693
本文简述HBuilderX中如何使用vue3.0项目
uni-app使用vue3、ts开发小程序微信分享到朋友和朋友圈
前端菜鸟好先森的博客
02-15 2599
uni-app使用vue3、ts开发小程序实现微信分享到朋友和朋友圈
vue create -p dcloudio/uni-preset-vue my-uni-app为啥我装出来是vue2项目交互式菜单中选择：也没有选择vue3
最新发布
07-09
首先，用户的问题是关于使用 `vue create -p dcloudio/uni-preset-vue my-uni-app` 命令创建 uni-app 项目时，为什么生成的是 Vue 2 项目而不是 Vue 3，并且交互式菜单中没有选项可以选择 Vue 3。 我需要参考提供的...
uni-app实战社区交友类app开发视频教程【超清完整版】
05-18
uni-app实战社区交友类app开发视频教程
uni-app跨平台开发
o1dkdj的博客
06-15 1022
Uni-app 框架提供了许多平台原生的 UI 控件和 API 的访问，但是这些控件和 API 在不同平台之间的支持和表现情况会有所不同，因此我们需要注意在编写代码时尽量避免使用不同平台独有的 API 或特性，同时要特别关注不同平台之间的差异，以便在不同平台上运行时代码能够正确地工作。Uni-app 运行在多个平台上，每个平台的特点是不同的。最后，总体来说，Uni-app 的跨平台开发提供了许多可能性和便利性，但也需要在搭建过程中注意兼容性问题，同时进行版本控制和测试，从而确保应用程序能够稳定地运行。
基于微信小程序的办公系统，基于vite,Vue3,Pinia,Typesrcipt,uni-app等技术栈开发.zip
12-13
【标题】基于微信小程序的办公系统，基于vite,Vue3,Pinia,Typescript,uni-app等技术栈开发 【描述】这是一个计算机类的毕业设计项目，它使用了最新的前端开发工具和技术，构建了一个微信小程序应用，适用于日常办公...
第一章 uniapp开发鸿蒙app项目搭建
weixin_54275215的博客
05-06 1864
记录本人使用uniapp开发鸿蒙的过程。本章记录项目创建的过程。项目框架：uniapp（vue3 + ts）+ uni-ui + pinia + 鸿蒙前端VUE3+Vite +UniAPP-- 框架搭建uni-ui官网Uni-app 开发鸿蒙 App 全攻略UniApp+Vue3引入Pinia的案例（小白通吃）Uniapp + Vue3 封装请求工具挂载全局HarmonyOS应用开发：Uniapp鸿蒙实战uni-app开发华为鸿蒙Harmony Next实践（保姆级）这个里面有SDK。
鸿蒙开发基础教程
07-13 1007
概述 官网说： HarmonyOS是一款“面向未来”、面向全场景（移动办公、运动健康、社交通信、媒体娱乐等）的分布式操作系统。在传统的单设备系统能力的基础上，HarmonyOS提出了基于同一套系统能力、适配多种终端形态的分布式理念，能够支持多种终端设备。 在我看来： HarmonyOS是一款可以用Java或JS开发的国产手机操作系统。也就意味着我们可以更快的入门鸿蒙开发。 对的，可以使用JS或Java开发鸿蒙应用，相比于Google推出的Fuchsia OS使用dart语言开发，简直良心到..
uniapp vue3 转换华为鸿蒙（以及问题一些解决方案）
m0_61382303的博客
08-06 5143
uniapp vue3 转换华为鸿蒙（以及问题一些解决方案）
【Web】使用Vue3开发鸿蒙的HelloWorld！
沙师弟专栏
05-10 2570
本文介绍了如何利用Vue3与HarmonyOS ArkUI框架进行鸿蒙原生应用开发。通过Vue3的响应式编程范式和ArkUI的声明式UI语法，开发者可以快速构建高性能的跨端应用。文章详细描述了从环境搭建到应用落地的全流程，包括开发环境的配置、Vue项目的创建与修改、静态资源的生成与导入，以及如何在DevEco Studio中进行应用签名和运行。最终，开发者可以将Vue3项目成功移植到华为Mate 60 Pro上，实现“一次开发，多端部署”的目标。
uni-app开发华为鸿蒙Harmony Next实践（保姆级）
热门推荐
weixin_46591361的博客
07-19 1万+
HBuilderX 新建一个空白的 uniapp 项目，选vue3(我选的是 uni-ui模板)创建好后，在 manifest.json 文件中配置鸿蒙离线SDK路径（就是上面3-2中的路径）},到这里就配置完成了，下一步运行自动失败不要怕，我们来手动启动3-3中打开的DevEco Studio直接运行我还在里面加了点uni-ui组件也是正常展示的到这整个配置运行就结束了。
鸿蒙应用开发--小白入门，菜鸟入门--模拟骰子应用开发初体验！入门测试，模拟骰子，总有一款适合你！！！
可及的小屋
09-16 2588
嗯，下载安装了下鸿蒙应用的IDE，学习了一下他们的文档，挺好的。就是模拟器太烦人，还需要登录，有时间限制。模拟器插件还容易故障，希望好好修改下嘛。 总的来说体验不错，很容易上手。 来话不多说，我们来看下。 首先是安装，配置和调试DevEco Studio 传送门在此 这里面讲的相当详细，这样的官方白皮书，还是全中文的，是不是感觉很幸福呢？这时候或许我们也就知道了一件事，为何老外学编程很简单，我们这边却很难，语言不同啊。唉。 ok，安装完成后呢，你可以先跑个HelloWorld。嗯。。得注册华为账号和开发者
uni-app 运行HarmonyOS项目
qq_36158551的博客
10-30 5268
注意：HX 4.31+ 同时支持在项目的 manifest.json 里面以图形界面修改鸿蒙配置（包括包名），如果在那里做了设置，将优先于 harmony-configs/AppScrope/app.json5 里面的 app.bundleName。将它复制到你的 uni-app 项目根目录的 harmony-configs/build-profile.json5 的 signingConfigs 配置中。（1）使用hbx（4.28以上），点击【发行】- 【App-Harmony-本地打包】。
uni-app 开发华为鸿蒙HarmonyOS NEXT初体验
qq_42072014的博客
08-17 4843
随着华为鸿蒙系统的不断发展，越来越多的开发者开始尝试使用uni-app来开发跨平台应用，特别是针对华为最新的HarmonyOS NEXT版本。本文将分享我在使用uni-app开发HarmonyOS NEXT应用的一些经验和心得，并提供具体的代码示例。通过本次初体验，我对使用uni-app开发HarmonyOS NEXT应用有了更深的认识。HarmonyOS NEXT带来的新特性不仅提升了用户体验，也为开发者提供了更多的可能性。HarmonyOS NEXT提供了改进的实况窗功能，可以创建更丰富的桌面小部件。
详细教程 - 从零开发 Vue 鸿蒙harmonyOS应用 第一节
爱蹦跶的全栈大A阿
12-11 3350
关于使用Vue开发鸿蒙应用的教程,我这篇之前的博客还不够完整和详细。那么这次我会尝试写一个更加完整和逐步的指南,从环境准备,到目录结构,再到关键代码讲解,以及调试和发布等,希望可以让大家详实地掌握这个过程。
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
表情包 代码片
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值