TypeScript 如何解析模块

未匹配的标注

TypeScript是模仿Node.js运行时的解析策略来在编译阶段定位模块定义文件。 因此,TypeScriptNode解析逻辑基础上增加了TypeScript源文件的扩展名( .ts.tsx.d.ts)。 同时,TypeScriptpackage.json里使用字段"typings"来表示类似"main"的意义 - 编译器会使用它来找到要使用的"main"定义文件。

比如,有一个导入语句import { b } from "./moduleB"/root/src/moduleA.ts里,会以下面的流程来定位"./moduleB"

  1. /root/src/moduleB.ts
  2. /root/src/moduleB.tsx
  3. /root/src/moduleB.d.ts
  4. /root/src/moduleB/package.json (如果指定了"typings"属性)
  5. /root/src/moduleB/index.ts
  6. /root/src/moduleB/index.tsx
  7. /root/src/moduleB/index.d.ts

回想一下Node.js先查找moduleB.js文件,然后是合适的package.json,再之后是index.js

类似地,非相对的导入会遵循Node.js的解析逻辑,首先查找文件,然后是合适的文件夹。 因此/src/moduleA.ts文件里的import { b } from "moduleB"会以下面的查找顺序解析:

  1. /root/src/node_modules/moduleB.ts
  2. /root/src/node_modules/moduleB.tsx
  3. /root/src/node_modules/moduleB.d.ts
  4. /root/src/node_modules/moduleB/package.json (如果指定了"typings"属性)
  5. /root/src/node_modules/moduleB/index.ts
  6. /root/src/node_modules/moduleB/index.tsx
  7. /root/src/node_modules/moduleB/index.d.ts
  1. /root/node_modules/moduleB.ts
  2. /root/node_modules/moduleB.tsx
  3. /root/node_modules/moduleB.d.ts
  4. /root/node_modules/moduleB/package.json (如果指定了"typings"属性)
  5. /root/node_modules/moduleB/index.ts
  6. /root/node_modules/moduleB/index.tsx
  7. /root/node_modules/moduleB/index.d.ts
  1. /node_modules/moduleB.ts
  2. /node_modules/moduleB.tsx
  3. /node_modules/moduleB.d.ts
  4. /node_modules/moduleB/package.json (如果指定了"typings"属性)
  5. /node_modules/moduleB/index.ts
  6. /node_modules/moduleB/index.tsx
  7. /node_modules/moduleB/index.d.ts

不要被这里步骤的数量吓到 - TypeScript只是在步骤(8)和(15)向上跳了两次目录。 这并不比Node.js里的流程复杂。

本文章首发在 LearnKu.com 网站上。

上一篇 下一篇
秦晓武
讨论数量: 0
发起讨论 只看当前版本


暂无话题~