前言

在前面文章中，我们介绍了如何在TS里使用命名空间，来组织你的代码，大概格式是：namespace X {}；而且我们解决了一个遗留问题：当单个文件过大，根据需求分离到不同的文件中；最后使用import q = x.y.z的形式来简化命名空间

相关传送门：

本文将描述常见的命名空间和模块的使用陷阱以及如何去避免它们

正文

在讲规避TS中命名空间和模块的陷阱之前，要简单说清楚这里的命名空间和模块

借用之前文章的一句话：

为了与ECMAScript 2015里的术语保持一致,从TypeScript 1.5开始,“外部模块”称为“模块”，而“内部模块”称做“命名空间”

下面来看常见的2个错误

对模块使用/// <reference>

一个常见的错误是使用/// <reference>引用模块文件，应该使用import

要理解他们之间的区别，我们的搞清楚编译器是如何根据import路径定位模块的类型信息

官方是这么说的：

编译器首先尝试去查找相应路径下的.ts，.tsx再或者.d.ts。 如果这些文件都找不到，编译器会查找 外部模块声明。

例如：

• myModules.d.ts文件中

// In a .d.ts file or .ts file that is not a module:
declare module "SomeModule" {
    export function fn(): string;
}

然后在其他模块文件中引用标签指定外来模块的位置

/// <reference path="myModules.d.ts" />
import * as m from "SomeModule";

不必要的命名空间

在TS中，不同的模块永远也不会在相同的作用域内使用相同的名字。 因为使用模块的人会为它们命名，所以完全没有必要把导出的符号包裹在一个命名空间里

使用命名空间是为了提供逻辑分组和避免命名冲突，不应该对模块使用命名空间

END

以上就是本文的所有内容，如有问题，欢迎指正~