TypeScript 模块系统

TypeScript 模块基于 ES 模块标准，通过 export/import 组织代码，下面梳理核心用法。

模块概念

每个 TypeScript 文件默认是一个独立模块，文件内部的变量、函数、类除非显式导出，否则外部不可见。

// math.ts
const PI = 3.14159;  // 模块内部私有，外部无法访问

export function add(a: number, b: number): number {
  return a + b;
}

注意：如果文件没有任何 export/import 语句，它会被视为全局脚本而非模块。

导出方式

命名导出

一个模块可有多个命名导出：

// utils.ts
export function log(msg: string): void {
  console.log(msg);
}

export const VERSION = "1.0.0";

export interface Config {
  debug: boolean;
}

默认导出

一个模块只能有一个默认导出：

// logger.ts
export default class Logger {
  log(msg: string) {
    console.log(msg);
  }
}

混合导出

// api.ts
export interface ApiResponse {
  code: number;
  data: unknown;
}

export default async function fetch<T>(url: string): Promise<ApiResponse> {
  const res = await fetch(url);
  return res.json();
}

导入方式

导入默认导出

import Logger from "./logger";

导入命名导出

import { log, VERSION, Config } from "./utils";

别名导入

import { log as print } from "./utils";

全部导入为命名空间

import * as Utils from "./utils";

Utils.log("hello");
console.log(Utils.VERSION);

仅执行模块副作用

import "./polyfill";  // 不导入任何内容，仅执行模块代码

导出与导入对比

路径解析规则

// 相对路径（相对于当前文件）
import { foo } from "./foo";
import { bar } from "../utils/bar";

// 非相对路径（基于 node_modules 或 tsconfig paths）
import { express } from "express";
import { Config } from "@/config";  // 需在 tsconfig.json 配置 paths

tsconfig.json 配置路径别名：

{
  "compilerOptions": {
    "baseUrl": ".",
    "paths": {
      "@/*": ["src/*"],
      "@utils/*": ["src/utils/*"]
    }
  }
}

要点总结

• 每个 TS 文件默认是独立模块，需显式 export 才能被外部访问
• 一个模块只能有一个 default export，但可有多个命名导出
• 默认导出导入时不需花括号，命名导出必须用花括号
• 路径别名需在 tsconfig.json 中配置 baseUrl + paths
• 推荐使用命名导出，便于 Tree-shaking 与统一导出