DEV Community

Cover image for Introduction to Modular Operation
liu yang
liu yang

Posted on

Introduction to Modular Operation

Introduction to Modular Operation

I. Modularization in ArkTS: An Overview

In the development of large - scale and complex applications, several issues may arise, such as increased package size due to multiple copies of code during compilation, file dependency challenges, difficulties in code and resource sharing, as well as issues with singletons and global variable pollution. To address these challenges and simplify code writing and functional maintenance for developers, ArkTS supports modular compilation, packaging, and execution.

Modularization involves dividing ArkTS/TS/JS code into multiple modules (files or fragments) and loading, parsing, combining, and executing these modules through compilation tools or runtime mechanisms. ArkTS supports various module types, including ets/ts/js files, json files, and Native modules. It also supports both ECMAScript and CommonJS module specifications. Additionally, ArkTS extends loading methods to include dynamic loading, lazy loading, synchronous dynamic loading of Native modules, and loading via Node - API interfaces.

II. Module Loading Process

The module loading process in ArkTS follows the ECMA specifications and employs a post - order traversal approach. Execution begins with the leftmost subtree of the module graph, followed by its siblings and then its parent. This recursive process continues until the root of the module graph is reached.

For example, in the following module graph, the execution order of the files is: D->F->G->E->B->I->H->C->A. Here, file A serves as the entry file, which is the starting point for execution. Built - in loading interfaces such as windowStage.loadContent and page - launching interfaces via routing (not using the import statement) treat the input files as entry files for execution.

Starting from the entry file A, the entire set of files is loaded, including file A itself, the files it depends on, and the files these dependent files rely on, until all leaf nodes of the branches are reached.

III. Module Specifications Supported by ArkTS

ECMAScript Modules

ECMAScript Modules (ES Modules) are a module feature standardized in JavaScript since ECMAScript 6.0. They are implemented through export and import statements.

The usage of export and import in ArkTS is detailed in the ArkTS language introduction.

CommonJS Modules

CommonJS modules emerged as a standard proposed by the JavaScript community in 2009 and were partially adopted and implemented in Node.js. Each file is treated as a module, with the module variable representing the current module. module.exports is used to export variables from the module, and each module also has an exports variable (exports === module.exports).

The following table illustrates the import and export syntax for CommonJS modules:

Loading Type Module Import Module Export (Do not mix module.exports and exports)
Variable const ohos = require('ohos') exports.add = add

module.exports.name = name

Variable| const ohos = require('ohos')| module.exports = add

Function| const ohos = require('ohos')

ohos.fun();

exports.fun = function foo () {}

module.exports.fun = function foo () {}

Note: CommonJS modules are only applicable for exporting third - party packages and are not supported for developers to create and use within projects.

Interoperability Between CommonJS and ES Modules

The following table outlines the interoperability between CommonJS and ES Modules:

Inter - Reference Relationship ES Module Export CommonJS Export
ES Module Import Supported Supported
CommonJS Import Not Supported Supported

IV. Module Types Supported by ArkTS

ets/ts/js Modules

Loading of ets/ts/js modules follows the ECMAScript and CommonJS module specifications.

JSON Files

JSON (JavaScript Object Notation) is a lightweight data - interchange format that uses a text - based format independent of any programming language to store and represent data.

JSON files can only be imported using the default method, as shown below:

import data from './example.json'
Enter fullscreen mode Exit fullscreen mode

Native Modules

Native modules (so files) follow the same import, export, and loading specifications as ets/ts/js modules. For more details, refer to the static loading of Native modules.

Note: Native modules cannot be imported within CommonJS modules.

Example:

// index.d.ts corresponding to libentry.so
export const add: (a: number, b: number) => number;
// test.ets
import { add } from 'libentry.so'
add(2, 3)

Current Limitations in ArkTS: Native modules do not support the simultaneous use of namespaces for both export and import.

Anti - example:

// test1.ets
export * from 'libentry.so' // Export using namespace
// test2.ets
import('./test1').then((ns:ESObject) => {
// Dynamic loading cannot obtain the ns object
// If you wish to load the Native module in this way, you need to change the export in test1.ets to a named export or a default export.
})

Top comments (0)

Some comments may only be visible to logged-in visitors. Sign in to view all comments.