发表是最好的记忆。
若干天前还啃了半天英文原文Module Resolution,然后,今天都忘了!于是重新复习一遍,且记录下来,算是做个笔记。
一、相对 vs 非相对模块导入
1.1 相对导入
以 /
, ./
, ../
开头的导入:
1 2 3
| import A from '/ModuleA'; import B from './ModuleB'; import C from '../ModuleC';
|
1.2 非相对导入
所有非相对导入之外的导入方式:
1 2
| import * as express from 'express'; import { Component } from 'angular2/core';
|
二、模块导入策略
TypeScript 模块导入策略默认为 node 和 classic 两种方式。我们可以通过 --moduleResolution
指定模块导入策略。如果没有指定的话,tsc 会根据 --module
指定的值选择策略:
1
| module === 'amd' | 'system' | 'ES6' ? 'classic' : 'node'
|
2.1 Classic
2.1.1 相对导入
文件 /root/src/folder/A.ts
:
1
| import { b } from "./moduleB";
|
这时编译器将搜索:
1 2
| /root/src/folder/moduleB.ts /root/src/folder/moduleB.d.ts
|
2.1.2 非相对导入时
文件 /root/src/folder/A.ts
:
1
| import { b } from "moduleB";
|
这时编译器将搜索:
1 2 3 4 5 6 7 8
| /root/src/folder/moduleB.ts /root/src/folder/moduleB.d.ts /root/src/moduleB.ts /root/src/moduleB.d.ts /root/moduleB.ts /root/moduleB.d.ts moduleB.ts moduleB.d.ts
|
2.2 Node
nodejs 的模块解析策略
相对导入
文件 /root/src/folder/A.js
:
1
| var b = require("./moduleB");
|
这时编译器将搜索:
1 2 3
| /root/src/folder/moduleB.js /root/src/folder/moduleB/package.json > main /root/src/folder/moduleB/index.ts
|
非相对导入
文件 /root/src/folder/A.js
:
1
| var b = require("moduleB");
|
这时编译器将搜索:
1 2 3
| /root/src/node_modules/moduleB.js /root/src/node_modules/moduleB/package.json > main /root/src/node_modules/moduleB/index.js
|
1 2 3
| /root/node_modules/moduleB.js /root/node_modules/moduleB/package.json > main /root/node_modules/moduleB/index.js
|
1 2 3
| /node_modules/moduleB.js /node_modules/moduleB/package.json > main /node_modules/moduleB/index.js
|
2.2.1 --moduleResolution=node
时,相对导入
文件 /root/src/folder/A.ts
:
1
| import B from "./moduleB";
|
这时编译器将搜索:
1 2 3 4 5 6 7
| /root/src/folder/moduleB.ts /root/src/folder/moduleB.tsx /root/src/folder/moduleB.d.ts /root/src/folder/moduleB/package.json > typings /root/src/folder/moduleB/index.ts /root/src/folder/moduleB/index.tsx /root/src/folder/moduleB/index.d.ts
|
2.2.2 --moduleResolution=node
时,非相对导入
文件 /root/src/folder/A.ts
:
1
| import B from "moduleB";
|
这时编译器将搜索:
1 2 3 4 5 6 7
| /root/src/node_modules/moduleB.ts /root/src/node_modules/moduleB.tsx /root/src/node_modules/moduleB.d.ts /root/src/node_modules/moduleB/package.json > typings /root/src/node_modules/moduleB/index.ts /root/src/node_modules/moduleB/index.tsx /root/src/node_modules/moduleB/index.d.ts
|
1 2 3 4 5 6 7
| /root/node_modules/moduleB.ts /root/node_modules/moduleB.tsx /root/node_modules/moduleB.d.ts /root/node_modules/moduleB/package.json > typings /root/node_modules/moduleB/index.ts /root/node_modules/moduleB/index.tsx /root/node_modules/moduleB/index.d.ts
|
1 2 3 4 5 6 7
| /node_modules/moduleB.ts /node_modules/moduleB.tsx /node_modules/moduleB.d.ts /node_modules/moduleB/package.json > typings /node_modules/moduleB/index.ts /node_modules/moduleB/index.tsx /node_modules/moduleB/index.d.ts
|