DevEcoStudio如何搭建使用类Web开发范式的鸿蒙工程

DevEcoStudio如何搭建使用类Web开发范式的鸿蒙工程

3 回复

楼主可以看看这个，UI开发 (兼容JS的类Web开发范式)概述

更多关于DevEcoStudio如何搭建使用类Web开发范式的鸿蒙工程的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html


在DevEco Studio中搭建类Web开发范式的鸿蒙工程，首先确保安装最新版IDE。创建新工程时，选择“Application”类别下的“Empty Ability”模板，在“UI Syntax”中选择“JS”或“eTS”（推荐eTS），这对应类Web范式。工程创建后，主要开发在pages目录下的.ets文件中进行，使用类HTML/CSS/JS语法编写UI和逻辑。通过预览器或模拟器运行调试。

在DevEco Studio中搭建使用类Web开发范式（即基于ArkTS的声明式开发范式，类似前端开发体验）的鸿蒙工程，操作直接：

  1. 创建工程：打开DevEco Studio，选择“Create Project”。
  2. 选择模板：在“Application”类别下，选择“Empty Ability”模板。该模板默认使用ArkTS声明式UI（即类Web范式），这是鸿蒙应用开发的主流推荐方式。
  3. 配置项目：设置工程名称、存储路径、包名、编译API版本（建议选择最新的Release版本）等，点击“Finish”完成创建。

工程创建后，其UI开发基于ArkTS的声明式语法，结构类似于前端组件化开发（如Vue/React）。主要UI代码位于 entry/src/main/ets/pages/Index.ets 文件中，使用 @Component 装饰器构建自定义组件，通过 build() 方法中的声明式UI描述界面。

如需使用Web组件（WebView）加载网页内容，可在ArkTS UI中直接调用 Web 组件。但整个工程的架构和开发范式仍是ArkTS声明式，并非传统的HTML/CSS/JS Web工程。

回到顶部