Angular中如何将接口导出至全局命名空间？

1. 将接口导出至全局命名空间需要涉及app.module.ts吗？ #

完全不需要！Angular模块的exports数组是专门用来导出可注入服务、组件、指令、管道这些Angular特定的可声明/可注入成员的，而TypeScript的接口/类型属于类型系统范畴，Angular模块根本管不到它们。你之前把接口放进exports数组的操作其实对类型共享没有任何作用，这是两个完全独立的机制。

2. 有没有其他实现方式（包括原生JavaScript方式）？ #

当然有，而且有几种不同的方案，适配不同的项目场景：

方案一：TypeScript全局类型声明（最推荐） #

创建一个.d.ts类型声明文件（比如src/app/global-types.d.ts），在里面声明全局命名空间的接口：

declare global {
  interface MyGlobalInterface {
    id: number;
    name: string;
    // 你的接口字段
  }
}

// 必须加这行，让TypeScript把这个文件识别为模块，否则全局声明不生效
export {};

只要这个文件在TypeScript的编译范围内（默认src下的文件都会被包含），整个项目里的任何组件、服务都可以直接使用MyGlobalInterface类型，不需要任何导入。

方案二：原生JavaScript全局对象模拟 #

如果是纯JS项目，因为JS本身没有接口概念，你可以把接口的“模板”挂到全局window对象上，作为结构参考：

// 在项目初始化的文件（比如main.js）里添加
window.MyGlobalInterface = {
  id: 0,
  name: "",
  // 定义模板字段
};

之后在任何JS文件里，都可以直接用这个全局对象来参考结构，但这只是模拟接口的作用，没有类型检查的能力。

方案三：共享类型模块+简化导入 #

如果不想用全局声明，也可以创建一个专门的共享类型文件，比如src/app/shared/types.ts，在里面导出所有需要共享的接口：

export interface User {
  id: number;
  username: string;
}

export interface Product {
  sku: string;
  price: number;
}

然后在tsconfig.json里配置paths，让导入路径更简洁：

{
  "compilerOptions": {
    "paths": {
      "@shared-types": ["src/app/shared/types"]
    }
  }
}

这样在组件里只需要写import type { User } from '@shared-types';，虽然还是要导入，但路径更短，也不用到处找文件位置。

3. 如果必须借助app.module.ts，该如何操作？ #

说实话，没法通过app.module.ts实现接口的全局共享，因为Angular模块的导出机制不处理TypeScript类型。但如果你坚持要和app.module.ts关联，可以在app.module.ts所在目录创建一个配套的类型文件，比如app.types.ts，导出接口，然后在app.module.ts里导入它（只是导入，不用放到exports里）：

// app.types.ts
export interface AppConfig {
  apiUrl: string;
  env: string;
}

// app.module.ts
import type { AppConfig } from './app.types';
// 这里只是导入类型，对其他组件没有共享作用

但这本质上还是需要每个组件自己导入AppConfig，并没有解决重复导入的问题。所以还是推荐前面的全局类型声明或者共享类型模块方案。

内容的提问来源于stack exchange，提问作者user11580406