无需DevEco Studio就能编译OHOS应用 _Studio

时人不识凌云木，直待凌云始道高。这篇文章主要讲述无需DevEco Studio就能编译OHOS应用相关的知识，希望能为你提供帮助。
在2022年3月31日发布了最新的IDE工具DevEco Studio 3.0 Beta3，仔细阅读文档后发现最新OpenHarmony应用的编译构建过程已经公开，对应官方文档：编译构建概述
出于好奇，就对着文档一步一步，一个文件一个文件的开始手动建立，最后编译成功，分享一下构建过程。
成果

文章图片

工具准备Node.js:v14.19.1+
最新OpenHarmonySDK包，并解压到一个文件夹中，SDK下载地址
SDK目录结构

|---ets |\\---3.1.5.5 |+---api |+---build-tools ||+---ets-loader |\\---component \\---toolchains \\---3.1.5.5 +---configcheck +---lib \\---syscapcheck

在创建好该目录结构后还需要在ets/js下的./3.1.5.5/build-tools/ets-loader/目录下执行npm install命令
创建工程 1.创建工程目录
为了演示我重新在E盘创建一个新的工程文件夹 BuildTest,然后借助vscode工具创建build-profile.json5、hvigofile.js、package.json这三个配置文件。
build-profile.json5:
注意SDK版本及srcPath配置，签名信息略想看相应配置参考上述官方文档

"app": "signingConfigs": [//工程的签名信息，可包含多个签名信息 ], "compileSdkVersion": 8,//指定OpenHarmony应用/服务编译时的SDK版本 "compatibleSdkVersion": 8,//指定OpenHarmony应用/服务兼容的最低SDK版本 "products": [//定义构建的产品品类，如通用默认版、付费版、免费版等"name": "default",//定义产品的名称，由开发者自定义 "signingConfig": "debug",//指定当前产品品类对应的签名信息，签名信息需要在signingConfigs中进行定义] , "modules": ["name": "entry",//模块名称 "srcPath": "./entry",//标明src目录相对工程根目录的相对路径 "targets": [//定义构建的产物，由product和各模块定义的targets共同定义"name": "default",//target名称，由各个模块的build-profile.json5中的targets字段定义 "applyToProducts": [//产品品类名称，由products字段进行定义 "default" ]]]

hvigorfile.js

module.exports = require(@ohos/hvigor-ohos-plugin).legacyAppTasks

package.json

熟悉npm框架的都应该了解，package.json是npm依赖相的配置文件，我们看看在工程目录下的配置项

"name": "buildtest", //工程名称 "version": "1.0.0", //版本 "ohos"://ohos "org": "huawei", "buildTool": "hvigor", "directoryLevel": "project" , "description": "example description", "repository": , "license": "ISC", "dependencies"://依赖项 "hypium": "^1.0.0", "@ohos/hvigor": "1.0.6", "@ohos/hvigor-ohos-plugin": "1.0.6"

配置完工程后，我们创建我们的第一个模块entry
2.创建模块
在工程目录创建文件夹entry（于上述build-profile.json5的module配置的srcPath保持一致），并添加模块配置文件：build-profile.json5、hvigorfile.js、package.json以及和HarmonyOS一样的src模块目录
build-profile.json5:
此处省略了Cpp配置，Cpp相关配置参考官方文档

"apiType": faMode,//API类型，API 8为FA模型，API 9为Stage模型，不需要修改 "showInServiceCenter": true,//是否在服务中心露出 "buildOption": "arkEnable": true,//是否使用方舟编译器进行编译 , "targets": [//模块对应的产物配置"name": "default",]

hvigorfile.js

module.exports = require(@ohos/hvigor-ohos-plugin).legacyHapTasks

大家来找茬，此处配置乍一看和工程下的hvigorfile.js一个样，其实require引入的模块却不相同，工程目录是legacyAppTasks此处是legacyHapTasks（工程是AppTasks模块是HapTasks）

我就因为此处配置问题浪费了十几分钟
package.json
此处的npm配置文件则是模块中引用第三方组件/插件配置处

"license": "ISC", "name": "entry", "ohos": "org": "huawei", "directoryLevel": "module", "buildTool": "hvigor" , "description": "example description", "repository": , "version": "1.0.0", "dependencies":

再在src目录下建立src/main/config.json、src/main/ets/app.ets、src/main/ets/pages/index.ets、src/resources/...等对应文件。此处省略，具体参考对应文件结构及文件。
3.构建 1.添加npm源
必须先添加harmonyOS的npm源，否则执行npm install 会报404错误

npm config set @ohos:registry=https://repo.harmonyos.com/npm/

2.在工程目录安装依赖
在工程目录（根目录）下安装依赖

npm install

3.执行构建命令
在工程目录执行构建命令
构建是通过node.js调用hvigor工具进行打包构建
确保node已添加在系统环境变量中

node ./node_modules/@ohos/hvigor/bin/hvigor.js -m module assembleHap

不出意外会出现以下错误：

PS E:\\BuildTest> node ./node_modules/@ohos/hvigor/bin/hvigor.js -m module assembleHap > hvigor ERROR: A problem occurred in root module: ERROR: Cause: Can not find sdk.dir or OHOS_SDK_HOME in System Environment Path at E:\\BuildTest\\local.properties:1:1 PS E:\\BuildTest>

以上原因是我们没有配置SDK路径
处理方式为：
在项目根路径创建 local.properties文件或者在系统环境变量中配置OHOS_SDK_HOME，注意是系统环境变量不是用户环境变量。
local.properties:

sdk.dir= //sdk所在文件夹 nodejs.dir=//nodejs所在文件夹

配置好后再重新执行构建命令就能看到我们构建成功的结果了。

文章图片

结语做了这么多步骤，那么有什么实际意义尼？
1.目前openharmony和HarmonyOS在UI上是共通的，只是API上不同。那么就能将HarmonyOS的UI直接拿到Openharmony上使用，直接打包构建openharmony的HAP
2.再加工一下可以像vue-cli那样直接创建出项目目录，如果能再实现preview功能，就可以实现无需依赖IDE就能开发打包HAP。
3.有机会自己自定义一个IDE出来，将上述过程黑盒化,想自己做IDE的朋友这一步肯定不能少。
【本文正在参与优质创作者激励】
想了解更多关于鸿蒙的内容，请访问：
51CTO和华为官方合作共建的鸿蒙技术社区
https://ost.51cto.com/#bkwz
::: hljs-center