《HarmonyOS应用开发基础》 课件 实操 项目1-任务1 搭建HarmonyOS应用开发环境.pptx

项目1走进HarmonyOS应用开发

任务1搭建HarmonyOS应用开发环境项目1走进HarmonyOS应用开发

任务描述本任务完成DevEcoStudio开发工具的下载、安装，并创建第一个HarmonyOSArkTS工程,预览应用并在模拟器上运行应用。

任务实施

010203060504下载并安装DevEcoStudio设置npm和Node.js下载HarmonyOSSDK在模拟器上运行HarmonyOS应用实时预览HarmonyOS应用创建HarmonyOS工程

下载并安装DevEcoStudioDevEcoStudio可以在HarmonyOSDeveloper官网（）下载，根据自己的计算机系统类型，下载对应版本的DevEcoStudio。DevEcoStudio支持Windows和macOS系统。本书的任务使用的是Window环境开发鸿蒙应用，这里以Windows为例进行安装。为保证DevEcoStudio正常运行，建议电脑配置满足如下要求：操作系统：Windows1064位内存：8GB及以上硬盘：100GB及以上分辨率：1280*800像素及以上

下载并安装DevEcoStudio选择Windows操作系统选择对应的版本进行下载。下载完成后，先解压安装包，双击解压好的“deveco-studio-xxxx.exe”，进入DevEcoStudio安装向导。在如下界面选择安装路径，默认安装于C:\ProgramFiles路径下，也可以单击Browse...指定其他安装路径，然后单击Next，如下图所示。

下载并安装DevEcoStudio勾选安装选项，安装完成后立即重启计算机，如下图所示。

设置npm和Node.js重启计算机后，打开DevEcoStudio，在出现的欢迎界面中单击“Agree”后，选择不导入之前的配置，如下图所示。欢迎页面导入设置

设置npm和Node.jsHarmonyOS基于ArkTS的开发，需要JavaScript运行环境，Node.js是一个JavaScript运行环境，在DevEcoStudio安装过程中需要安装Node.js和npm包管理器，按提示进行Node.js和npm的镜像设置和的下载，如下图所示。欢迎页面导入设置

下载HarmonyOSSDK经过上述步骤后，DevEcoStudio会自动检查本地路径下是否存在HarmonyOSSDK。如果不存在，会弹出SDK的安装向导，选择SDK的存放路径（可自定义），确认SDK的设置，如下图所示。欢迎页面导入设置

下载HarmonyOSSDK在弹出来的接受许可协议页面，选择“Accept”，接受协议后，等待SDK下载完毕，如下图所示。欢迎页面导入设置

下载HarmonyOSSDKSDK下载完毕后，就会进入EevEcoStudio欢迎页面，默认欢迎页面是黑底白字的，需要的时候可以设置为白底黑字，如下图所示。至此，就安装并配置好了EevEcoStudio开发工具。

创建HarmonyOS工程首次打开DevEcoStudio，可以从欢迎页单击CreateProject，创建一个新工程。（在DevEcoStudio打开工程的情况下，可以单击FilenewCreateProject），根据工程创建向导，单击CreateProject，进入项目创建页面。DevEcoStudio为我们提供了HarmonyOS和OpenHarmony的创建模板，我们这里选择创建HarmonyOS。在HarmonyOS页签，选择“EmptyAbility”模板，然后单击Next，如下图所示。

创建HarmonyOS工程填写工程相关信息，如下图所示。（默认情况下，新建工程的CompileSDK为9，在设备中运行该工程时，请选择API9及以上的设备才能运行该工程。）

创建HarmonyOS工程填写完项目创建信息，点击“Finish”后,工具会自动生成模板代码和相关资源，接下来需要等待项目创建完成，当底部右区域状态栏不再变化，就说明项目构建完成了。

实时预览HarmonyOS应用此时项目默认打开Index.ets页面，可以点击右侧的Previewer预览器按钮，查看应用的运行效果，如下图所示。

实时预览HarmonyOS应用DevEcoStuidio可以在页面开发过程中同步更新预览效果，通过预览器可以实时查看、编辑组件的属性，方便开发者随时调整代码，并实时查看应用/服务的运行效果。打开上述构建完毕的项目下的pages/Index.ets页面，单击预览器，即可呈现实时界面的预览效果；在预览器选项卡，点击多设备预览按钮，针对性的查看在某类型设备上的布局效果，如下图所示。

在模拟器上运行Harmony