【HarmonyOS NAPI 深度探索12】创建你的第一个 HarmonyOS NAPI 模块

在本篇文章中，我们将一步步走过如何创建一个简单的 HarmonyOS NAPI 模块。通过这个模块，你将能够更好地理解 NAPI 的工作原理，并在你的应用中开始使用 C++ 与 JavaScript 的交互。我们将从头开始创建，帮助你快速入门。

准备工作

首先，确保你已经完成了前面的环境搭建和 DevEco Studio 的安装。如果还没有，可以参考我们之前的教程进行安装，并确保你能够在 DevEco Studio 中正常创建项目。

创建项目

启动 DevEco Studio
打开 DevEco Studio，进入主界面后点击 File > New > Project，选择 Native C++：

在这里插入图片描述

选择开发平台
输入项目名称，例如 MyFirstNapiModule，以及包名、项目位置、编译SDK版本模块名称（默认entry）以及设备类型，目前支持：
- Phone
- Tablet
- 2in1
- Car
  默认已勾选了前三个：
项目结构概览
项目创建后，在entry下你会看到一个基本的项目结构。关键部分包括：
- cpp/napi_init.cpp 文件： C++ 代码。
- cpp/types 文件夹：动态库声明以及接口声明。
- CMakeList.txt：用于构建C++的配置文件。

编写 C++ 模块代码

编辑 C++ 代码
在 napi_init.cpp 文件下，实现了一个简单的加法运算示例，通过TS传入两个数字，C++中相加后返回到TS。代码如下：

    #include "napi/native_api.h"  
	static napi_value Add(napi_env env, napi_callback_info info)  
	{  
	    size_t argc = 2;  
	    napi_value args[2] = {nullptr};  
	  
	    napi_get_cb_info(env, info, &argc, args , nullptr, nullptr);  
	  
	    napi_valuetype valuetype0;  
	    napi_typeof(env, args[0], &valuetype0);  
	  
	    napi_valuetype valuetype1;  
	    napi_typeof(env, args[1], &valuetype1);  
	  
	    double value0;  
	    napi_get_value_double(env, args[0], &value0);  
	  
	    double value1;  
	    napi_get_value_double(env, args[1], &value1);  
	  
	    napi_value sum;  
	    napi_create_double(env, value0 + value1, &sum);  
	  
	    return sum;  
	  
	}  
	  
	EXTERN_C_START  
	static napi_value Init(napi_env env, napi_value exports)  
	{  
	    napi_property_descriptor desc[] = {  
	        { "add", nullptr, Add, nullptr, nullptr, nullptr, napi_default, nullptr }  
	    };  
	    napi_define_properties(env, exports, sizeof(desc) / sizeof(desc[0]), desc);  
	    return exports;  
	}  
	EXTERN_C_END  
	  
	static napi_module demoModule = {  
	    .nm_version = 1,  
	    .nm_flags = 0,  
	    .nm_filename = nullptr,  
	    .nm_register_func = Init,  
	    .nm_modname = "entry",  
	    .nm_priv = ((void*)0),  
	    .reserved = { 0 },  
	};  
	  
	extern "C" __attribute__((constructor)) void RegisterEntryModule(void)  
	{  
	    napi_module_register(&demoModule);  
	}

这段代码中，我们定义了一个简单的 `Add` 函数，它将最后相加结果返回给 JavaScript 层。

配置 CMakeLists.txt
确保你的 CMakeLists.txt 文件包含正确的配置，来编译和链接你的原生模块。一个基本的 CMakeLists.txt 配置如下：

# the minimum version of CMake.  
cmake_minimum_required(VERSION 3.5.0)  
project(nativedemo)  
  
set(NATIVERENDER_ROOT_PATH ${CMAKE_CURRENT_SOURCE_DIR})  
  
if(DEFINED PACKAGE_FIND_FILE)  
    include(${PACKAGE_FIND_FILE})  
endif()  
  
include_directories(${NATIVERENDER_ROOT_PATH}  
                    ${NATIVERENDER_ROOT_PATH}/include)  
  
add_library(entry SHARED napi_init.cpp)  
target_link_libraries(entry PUBLIC libace_napi.z.so)

这个文件告诉 CMake 如何编译 C++ 代码并链接到 Node.js 库。

编写 JavaScript 调用代码

在Index.ets文件中调用C++提供的Add方法
代码如下：

import { hilog } from '@kit.PerformanceAnalysisKit';  
import testNapi from 'libentry.so';  
  
@Entry  
@Component  
struct Index {  
  @State message: string = 'Hello World';  
  
  build() {  
    Row() {  
      Column() {  
        Text(this.message)  
          .fontSize(50)  
          .fontWeight(FontWeight.Bold)  
          .onClick(() => {  
            hilog.info(0x0000, 'testTag', 'Test NAPI 2 + 3 = %{public}d', testNapi.add(2, 3));  
          })  
      }  
      .width('100%')  
    }  
    .height('100%')  
  }  
}

这里我们通过 `import testNapi from 'libentry.so'` 引入 C++ 模块，并调用 `add()` 方法，输入两个参数，它会输出 C++ 中相加的结果。

构建和调试

构建项目
在 DevEco Studio 中，点击 Build > Build Project，DevEco Studio 会使用 CMake 编译 C++ 代码并生成共享库。构建成功后，你会看到 BUILD SUCCESSFUL 的提示。
调试项目
在 DevEco Studio 中，你可以设置断点并启动调试器，查看 C++ 代码执行的详细过程。点击 Run > Debug，选择目标设备进行调试。