TypeScript 模块化

1. 模块的概念

在 TypeScript 中，模块是指一组相关的代码单元，它们可以被封装在一起，并通过导入和导出的方式与其他模块进行交互。这种模块化的设计使得代码的组织更加清晰，并且能够有效地解决命名冲突和作用域污染的问题。

2. 模块的导出和导入

在 TypeScript 中，使用 export 关键字可以将变量、函数、类等导出，使其可以在其他模块中被引用。例如：

// utils.ts
export function add(a: number, b: number): number {
    return a + b;
}

在另一个模块中，可以使用 import 关键字导入这个模块：

// main.ts
import { add } from './utils';

console.log(add(1, 2)); // 输出：3

3. 默认导出

除了具名导出，TypeScript 还支持默认导出。一个模块只能有一个默认导出，而且在导入时可以不使用大括号。例如：

// utils.ts
export default function add(a: number, b: number): number {
    return a + b;
}

导入时可以这样使用：

// main.ts
import add from './utils';

console.log(add(1, 2)); // 输出：3

4. 模块路径

在导入模块时，需要指定模块的路径。TypeScript 支持相对路径和绝对路径两种方式。相对路径是相对于当前文件的路径，而绝对路径则是从根路径开始的路径。例如：

// 相对路径导入
import { func } from './utils';

// 绝对路径导入
import { func } from 'src/utils';

5. 模块别名

有时候，模块路径会比较长或者复杂，为了简化导入语句，可以使用模块别名。例如：

// 使用别名导入
import { func } from '@utils';

可以在 TypeScript 的配置文件 tsconfig.json 中配置模块路径的别名，以方便使用。