鸿蒙开发工具DevEco Studio的安装及第一个HelloWorld展示

DevEco Studio下载地址
https://developer.harmonyos.com/cn/develop/deveco-studio

notejs下载地址:https://nodejs.org/zh-cn/
使用DevEco Studio需要先安装和配置notejs,如果有安装和配置notejs可以跳过此步骤

notejs安装与配置

notejs安装

下载notejs鸿蒙开发工具DevEco Studio的安装及第一个HelloWorld展示_第1张图片

双击node-v8.11.3-x64.msi安装

鸿蒙开发工具DevEco Studio的安装及第一个HelloWorld展示_第2张图片

点击next后,勾选I accept…,点击next

鸿蒙开发工具DevEco Studio的安装及第一个HelloWorld展示_第3张图片

选择安装地址,最好不要安装到C盘

鸿蒙开发工具DevEco Studio的安装及第一个HelloWorld展示_第4张图片

点击next->点击install

鸿蒙开发工具DevEco Studio的安装及第一个HelloWorld展示_第5张图片
鸿蒙开发工具DevEco Studio的安装及第一个HelloWorld展示_第6张图片
鸿蒙开发工具DevEco Studio的安装及第一个HelloWorld展示_第7张图片
鸿蒙开发工具DevEco Studio的安装及第一个HelloWorld展示_第8张图片

配置环境变量

单击此电脑->右击选择属性->弹窗点击高级系统设置->弹窗点击环境变量

鸿蒙开发工具DevEco Studio的安装及第一个HelloWorld展示_第9张图片
鸿蒙开发工具DevEco Studio的安装及第一个HelloWorld展示_第10张图片

编辑环境变量path,增加nodejs变量,值就是nodejs的安装路径

鸿蒙开发工具DevEco Studio的安装及第一个HelloWorld展示_第11张图片
这样nodejs就安装和配置好了,接下来就是DevEco Studio的安装了

DevEco Studio的安装

下载DevEco Studio

下载地址在开头处,下载解压好后如下
鸿蒙开发工具DevEco Studio的安装及第一个HelloWorld展示_第12张图片

双击deveco-studio-2.0.8.203.exe安装

鸿蒙开发工具DevEco Studio的安装及第一个HelloWorld展示_第13张图片

选择安装路径,最好不要选择在C盘,点击next

鸿蒙开发工具DevEco Studio的安装及第一个HelloWorld展示_第14张图片

将三个都勾选,点击next

鸿蒙开发工具DevEco Studio的安装及第一个HelloWorld展示_第15张图片

点击install

鸿蒙开发工具DevEco Studio的安装及第一个HelloWorld展示_第16张图片
鸿蒙开发工具DevEco Studio的安装及第一个HelloWorld展示_第17张图片

选择I want to manually reboot later,点击finish

鸿蒙开发工具DevEco Studio的安装及第一个HelloWorld展示_第18张图片

选择Do not import settings

鸿蒙开发工具DevEco Studio的安装及第一个HelloWorld展示_第19张图片

勾选I confirm…,点击Agree

鸿蒙开发工具DevEco Studio的安装及第一个HelloWorld展示_第20张图片

打开DevEco Studio,在首页点击configure->setting

鸿蒙开发工具DevEco Studio的安装及第一个HelloWorld展示_第21张图片
鸿蒙开发工具DevEco Studio的安装及第一个HelloWorld展示_第22张图片
选择Appearance & Behavior->HarmonyOS SDK
鸿蒙开发工具DevEco Studio的安装及第一个HelloWorld展示_第23张图片
点击HarmonyOS SDK Location后面的Edit重新选择地址
鸿蒙开发工具DevEco Studio的安装及第一个HelloWorld展示_第24张图片

选择相应的地址后点击Next

鸿蒙开发工具DevEco Studio的安装及第一个HelloWorld展示_第25张图片

选择Accept,点击next鸿蒙开发工具DevEco Studio的安装及第一个HelloWorld展示_第26张图片

鸿蒙开发工具DevEco Studio的安装及第一个HelloWorld展示_第27张图片
鸿蒙开发工具DevEco Studio的安装及第一个HelloWorld展示_第28张图片

在SDK Platforms中勾选Native和Js

鸿蒙开发工具DevEco Studio的安装及第一个HelloWorld展示_第29张图片

在SDK Tools中勾选previewer

鸿蒙开发工具DevEco Studio的安装及第一个HelloWorld展示_第30张图片

点击Apply,系统开始下载相应的组件

(这里比较耗时,而且常常下载不下来,我这边实验了很多次,能下载下来有点靠运气)
鸿蒙开发工具DevEco Studio的安装及第一个HelloWorld展示_第31张图片
鸿蒙开发工具DevEco Studio的安装及第一个HelloWorld展示_第32张图片
下载好后如下:
鸿蒙开发工具DevEco Studio的安装及第一个HelloWorld展示_第33张图片
如果下载太慢可以试试在CMD中添加华为云映射

鸿蒙开发工具DevEco Studio的安装及第一个HelloWorld展示_第34张图片
接下来接可以新建鸿蒙项目了!!!

新建鸿蒙项目

在首页选择Create HamonyOS Project

鸿蒙开发工具DevEco Studio的安装及第一个HelloWorld展示_第35张图片

下一页上面选择手表Lite Wearable,下载选择Empty Feathure Ability

鸿蒙开发工具DevEco Studio的安装及第一个HelloWorld展示_第36张图片

进入项目后,系统自动下载gradle

不过有时下载不下来

在这里插入图片描述

这时候我们可以自己下载gradle放入相应路径

gradle下载地址:https://gradle.org/releases/
gradle路径可以在file->setting->Build,Execution,Deployment->gradle下可以看到
鸿蒙开发工具DevEco Studio的安装及第一个HelloWorld展示_第37张图片

将gradle放入相应路径,重新启动DevEco Studio

鸿蒙开发工具DevEco Studio的安装及第一个HelloWorld展示_第38张图片
鸿蒙开发工具DevEco Studio的安装及第一个HelloWorld展示_第39张图片

鸿蒙模拟器更新

鸿蒙开发工具DevEco Studio的安装及第一个HelloWorld展示_第40张图片
鸿蒙开发工具DevEco Studio的安装及第一个HelloWorld展示_第41张图片
鸿蒙开发工具DevEco Studio的安装及第一个HelloWorld展示_第42张图片
这里不更新也可以启动

项目启动

鸿蒙开发工具DevEco Studio的安装及第一个HelloWorld展示_第43张图片
鸿蒙开发工具DevEco Studio的安装及第一个HelloWorld展示_第44张图片
可以看到在鸿蒙手表中看到默认的Hello World字样
鸿蒙开发工具DevEco Studio的安装及第一个HelloWorld展示_第45张图片
这个字样是由这里来的
鸿蒙开发工具DevEco Studio的安装及第一个HelloWorld展示_第46张图片
鸿蒙开发工具DevEco Studio的安装及第一个HelloWorld展示_第47张图片
更多技术交流请加入QQ群
群名称:华为鸿蒙harmonyos开发
群 号:1164091073

你可能感兴趣的:(HarmonyOS,nodejs)