1# Introduction to Modular Operation
2
3During the development of large-scale and complex applications, some code is copied for multiple times during compilation. As a result, the package size increases, file dependency, code and resource sharing is difficult, and singleton and global variable pollution occurs. In addition, ArkTS supports modular compilation, packaging, and running of applications to facilitate code compilation and function maintenance.
4
5Modularization refers to the process of splitting ArkTS/TS/JS into multiple modules (files or fragments) and loading, parsing, combining, and executing these modules using compilation tools or runtime mechanisms.
6
7ArtTS supports ETS/TS/JS files, JSON files, and native modules. ArkTS supports [ECMAScript module specifications](#ecmascript-module) and [CommonJS module specifications](#commonjs-module). In addition, ArkTS extends the loading modes, including dynamic loading (arkts-dynamic-import.md), delayed loading (arkts-lazy-import.md), and synchronous dynamic loading of native modules (js-apis-load-native-module.md). [Node-API interface loading file](load-module-base-nodeapi.md)
8
9## Loading Process of Modular Operation
10
11ArkTS modular runs are implemented according to the ECMA specification, and modules are executed in a later sequential traversal manner: starting from the leftmost subtree of the module diagram, executing the modules, then executing their peers, and then executing their parent. This algorithm runs recursively until it reaches the root of the module graph.
12
13As shown in the following figure, each parent node loads the corresponding child nodes and executes the child nodes at the same level based on the import sequence in the code. The following module diagram files are executed in the sequence of D->F->G->E->B->I->H->C->A.
14
15![image_0000002043487154](figures/image_0000002043487154.png)
16
17The file A is referred to as an entry file, that is, the file is an execution start point. Some built-in loading interfaces, such as [windowStage.loadContent](../reference/apis-arkui/js-apis-window.md#loadcontent9) and [Navigation](../ui/arkts-navigation-navigation.md), are used to start pages (that is, files that are not started by using the import method). The input parameter file is executed as the entry file.
18
19File A is used as the entry to load a complete set of files, including file A, files on which file A depends, and files on which file A depends until each branch leaf node.
20
21## Modular Specifications Supported by ArkTS
22
23### ECMAScript Module
24
25The ECMAScript module (ES Module) is a module function implemented by JavaScript from the standard level (ECMAScript® 2025 Language Specification (tc39.es)) since ECMAScript6.0. The module function consists of two commands: export and import.
26
27For details about how to use export and import in ArkTS, see [ArkTS Introduction](../quick-start/introduction-to-arkts.md#module).
28
29### CommonJS Module
30
31The CommonJS module is a standard proposed by the JavaScript community in 2009. Some standards are first adopted and implemented in Node.js. The CommonJS considers each file as a module and uses the module variable to represent the current module. The module.exports variable is the variable exported by the module. Each module has the exports variable (exports = = = module.exports).
32
33The following table lists the import and export methods.
34
35| Loading Type| Module import| Module export (module.exports and exports cannot be used together.)|
36| -------- | -------- | -------- |
37| Name| const ohos = require('ohos') | exports.add = add<br>module.exports.name = name |
38| const ohos = require('ohos') | module.exports = add |
39| Functions| const ohos = require('ohos')<br>ohos.fun(); | exports.fun = function foo () {}<br>module.exports.fun = function foo () {} |
40
41> **Note**
42>
43> The CommonJS module applies only to third-party package export and cannot be created or used by developers in projects.
44
45
46### Specifications Supported by CommonJS and ES Modules
47
48The following table lists the specifications for mutual reference between CommonJS and ES Module. The import and export syntax complies with the specifications of each module.
49| Mutual reference relationship| ES Module Export| CommonJS export|
50| -------- | -------- | -------- |
51| ES Module Import| Yes.| Yes.|
52| Importing CommonJS| Not supported| Yes|
53
54## Types of Modules That Can Be Loaded by ArkTS
55
56### ets/ts/js
57
58The loading of the ETS, TS, and JS modules complies with [ECMAScript](#ecmascript-module) and [CommonJS](#commonjs-module) module specifications.
59
60### JSON File
61
62JavaScript Object Notation (JSON) is a lightweight data interaction format that uses a text format that is completely independent of programming languages to store and represent data.
63
64The JSON file can be imported only in default mode, as shown in the following:
65
66```
67import data from './example.json'
68```
69
70### Native Module
71
72The syntax specifications for importing and exporting the native module (.so) are the same as those for loading the ETS, TS, and JS files.
73
74> **Note**
75>
76> The Native module cannot be imported to the CommonJS module.
77
78Example:
79
80```
81// index.d.ts corresponding to libentry.so
82export const add: (a: number, b: number) => number;
83```
84
85```
86// test.ets
87import { add } from 'libentry.so'
88add(2, 3)
89```
90
91ArkTS does not support namespaces for both native module export and import.
92
93Non-compliant code example:
94
95```
96// test1.ets
97export * from'libentry.so' // Use the namespace to export data.
98```
99
100```
101// test2.ets
102import('./test1').then((ns:ESObject) => {
103  // The ns object cannot be obtained during dynamic loading.
104  // If you want to use this method to load the Native module, change the export mode in test1.ets to named export or default export.
105})
106```
107
108> **Note**
109>
110> You are not advised to import data in import \* as xxx from 'xxx' mode. This import mode will cause runtime exceptions. You are advised to use the default import mode.
111