6
6
7
7
模块本身就是一个作用域,不属于全局作用域。模块内部的变量、函数、类只在内部可见,对于模块外部是不可见的。暴露给外部的接口,必须用 export 命令声明;如果其他文件要使用模块的接口,必须用 import 命令来输入。
8
8
9
- 如果一个文件不包含 export 语句,但是希望把它当作一个模块(即内部变量对外不可见),可以在文件中添加一行语句 。
9
+ 如果一个文件不包含 export 语句,但是希望把它当作一个模块(即内部变量对外不可见),可以在脚本头部添加一行语句 。
10
10
11
11
``` typescript
12
12
export {};
@@ -33,20 +33,12 @@ export { Bool };
33
33
假定上面的模块文件为` a.ts ` ,另一个文件` b.ts ` 就可以使用 import 语句,输入这个类型。
34
34
35
35
``` typescript
36
- import { Bool } from ' ./a.js ' ;
36
+ import { Bool } from ' ./a' ;
37
37
38
38
let foo: Bool = true ;
39
39
```
40
40
41
- 上面示例中,import 语句加载的是一个类型。注意,它是从文件` a.js ` 加载,而不是从` a.ts ` 加载,因为在代码运行环境是 JS 环境,所以要写成从 JS 文件加载,否则报错。
42
-
43
- TypeScript 允许加载模块时,省略模块文件的后缀名,它会自动定位。
44
-
45
- ``` typescript
46
- import { Bool } from ' ./a' ;
47
- ```
48
-
49
- 上面示例中,模块名写成` ./a ` ,TypeScript 会自动定位到` ./a.ts ` 。
41
+ 上面示例中,import 语句加载的是一个类型。注意,加载文件写成` ./a ` ,没有写脚本文件的后缀名。TypeScript 允许加载模块时,省略模块文件的后缀名,它会自动定位,将` ./a ` 定位到` ./a.ts ` 。
50
42
51
43
编译时,可以两个脚本同时编译。
52
44
@@ -85,7 +77,7 @@ export interface A {
85
77
export let a = 123 ;
86
78
87
79
// b.ts
88
- import { A , a } from ' ./a.js ' ;
80
+ import { A , a } from ' ./a' ;
89
81
```
90
82
91
83
上面示例中,文件` a.ts ` 的 export 语句输出了一个类型` A ` 和一个正常接口` a ` ,另一个文件` b.ts ` 则在同一条语句中输入了类型和正常接口。
@@ -95,19 +87,19 @@ import { A, a } from './a.js';
95
87
第一个方法是在 import 语句输入的类型前面加上` type ` 关键字。
96
88
97
89
``` typescript
98
- import { type A , a } from ' ./a.js ' ;
90
+ import { type A , a } from ' ./a' ;
99
91
```
100
92
101
- 上面示例中,import 语句输入的类型` A ` 前面有` type ` 关键字,表示这是一个类型。
93
+ 上面示例中,import 语句输入的类型` A ` 前面有` type ` 关键字,表示这是一个类型。
102
94
103
95
第二个方法是使用 import type 语句,这个语句只能输入类型,不能输入正常接口。
104
96
105
97
``` typescript
106
98
// 正确
107
- import type { A } from ' ./a.js ' ;
99
+ import type { A } from ' ./a' ;
108
100
109
101
// 报错
110
- import type { a } from ' ./a.js ' ;
102
+ import type { a } from ' ./a' ;
111
103
```
112
104
113
105
上面示例中,import type 输入类型` A ` 是正确的,但是输入正常接口` a ` 就会报错。
@@ -153,7 +145,7 @@ export type { Point };
153
145
上面示例中,由于使用了 export type 语句,输出的并不是 Point 这个类,而是 Point 代表的实例类型。输入时,只能作为类型输入。
154
146
155
147
``` typescript
156
- import type { Point } from ' ./module.js ' ;
148
+ import type { Point } from ' ./module' ;
157
149
158
150
const p: Point = { x: 0 , y: 0 };
159
151
```
@@ -162,7 +154,7 @@ const p:Point = { x: 0, y: 0 };
162
154
163
155
## importsNotUsedAsValues
164
156
165
- 输入类型的 import 语句,编译时怎么处理 ?
157
+ 输入类型的 import 语句,编译时怎么处理呢 ?
166
158
167
159
TypeScript 提供了` importsNotUsedAsValues ` 编译设置项,有三个可能的值。
168
160
@@ -175,7 +167,7 @@ TypeScript 提供了`importsNotUsedAsValues`编译设置项,有三个可能的
175
167
请看示例,下面是一个输入类型的 import 语句。
176
168
177
169
``` typescript
178
- import { TypeA } from ' ./a.js ' ;
170
+ import { TypeA } from ' ./a' ;
179
171
```
180
172
181
173
上面示例中,` TypeA ` 是一个类型。
@@ -185,7 +177,7 @@ import { TypeA } from './a.js';
185
177
` preserve ` 的编译结果会保留该语句,但会把删掉类型的部分。
186
178
187
179
``` typescript
188
- import ' ./a.js ' ;
180
+ import ' ./a' ;
189
181
```
190
182
191
183
上面示例中,编译后的 import 语句不从` a.js ` 输入任何接口,但是会引发` a.js ` 的执行,因此会保留` a.js ` 里面的副作用。
@@ -202,14 +194,14 @@ CommonJS 是 Node.js 的专用模块格式,与 ES 模块格式不兼容。
202
194
203
195
### import = 语句
204
196
205
- TypeScript 使用 import = 语句输入 CommonJS 模块。
197
+ TypeScript 使用` import = ` 语句输入 CommonJS 模块。
206
198
207
199
``` typescript
208
200
import fs = require (' fs' );
209
201
const code = fs .readFileSync (' hello.ts' , ' utf8' );
210
202
```
211
203
212
- 上面示例中,使用 import = 语句和` require() ` 命令输入了一个 CommonJS 模块。模块本身的用法跟 Node.js 是一样的。
204
+ 上面示例中,使用` import = ` 语句和` require() ` 命令输入了一个 CommonJS 模块。模块本身的用法跟 Node.js 是一样的。
213
205
214
206
除了使用` import = ` 语句,TypeScript 还允许使用` import * as [接口名] from "模块文件" ` 输入 CommonJS 模块。
215
207
@@ -221,15 +213,15 @@ import fs = require('fs');
221
213
222
214
### export = 语句
223
215
224
- TypeScript 使用 export = 语句,输出 CommonJS 模块的对象,等同于 CommonJS 的` module.exports ` 对象。
216
+ TypeScript 使用` export = ` 语句,输出 CommonJS 模块的对象,等同于 CommonJS 的` module.exports ` 对象。
225
217
226
218
``` typescript
227
219
let obj = { foo: 123 };
228
220
229
221
export = obj ;
230
222
```
231
223
232
- export = 语句输出的对象,只能使用 import = 语句加载。
224
+ ` export = ` 语句输出的对象,只能使用` import = ` 语句加载。
233
225
234
226
``` typescript
235
227
import obj = require (' ./a' );
@@ -249,7 +241,7 @@ import { TypeA } from './a';
249
241
250
242
模块定位有两种方法,一种称为 Classic 方法,另一种称为 Node 方法。可以使用编译参数` moduleResolution ` ,指定使用哪一种方法。
251
243
252
- 没有指定定位方法时,就看原始脚本采用什么模块格式。如果模块格式是 CommonJS, 即编译时指定` --module commonjs ` ,那么模块定位采用 Node 方法,否则采用 Classic 方法(模块格式为 es2015、 esnext、amd, system, umd 等等)。
244
+ 没有指定定位方法时,就看原始脚本采用什么模块格式。如果模块格式是 CommonJS( 即编译时指定` --module commonjs ` ) ,那么模块定位采用 Node 方法,否则采用 Classic 方法(模块格式为 es2015、 esnext、amd, system, umd 等等)。
253
245
254
246
### 相对模块,非相对模块
255
247
@@ -288,15 +280,15 @@ Node 方法就是模拟 Node.js 的模块加载方法。
288
280
2 . 当前目录的子目录` node_modules ` ,是否存在文件` package.json ` ,该文件的` types ` 字段是否指定了入口文件,如果是的就加载该文件。
289
281
3 . 当前目录的子目录` node_modules ` 里面,是否包含子目录` @types ` ,在该目录中查找文件` b.d.ts ` 。
290
282
4 . 当前目录的子目录` node_modules ` 里面,是否包含子目录` b ` ,在该目录中查找` index.ts ` 、` index.tsx ` 、` index.d.ts ` 。
291
- 5 . 进入上一层目录,重复上面4步,直到找到为止。
283
+ 5 . 进入上一层目录,重复上面4步,直到找到为止。
292
284
293
285
### 路径映射
294
286
295
- TypeScript 允许开发者在` tsconfig.json ` 文件里面,手动指定模块的路径 。
287
+ TypeScript 允许开发者在` tsconfig.json ` 文件里面,手动指定脚本模块的路径 。
296
288
297
- (1)baseUrl
289
+ (1)baseUrl
298
290
299
- ` baseUrl ` 字段可以手动指定模块的基准目录 。
291
+ ` baseUrl ` 字段可以手动指定脚本模块的基准目录 。
300
292
301
293
``` typescript
302
294
{
@@ -310,7 +302,7 @@ TypeScript 允许开发者在`tsconfig.json`文件里面,手动指定模块的
310
302
311
303
(2)paths
312
304
313
- ` paths ` 字段指定非相对模块与实际脚本的映射 。
305
+ ` paths ` 字段指定非相对路径的模块与实际脚本的映射 。
314
306
315
307
``` typescript
316
308
{
@@ -373,3 +365,4 @@ $ tsc app.ts moduleA.ts --noResolve
373
365
## 参考链接
374
366
375
367
- [ tsconfig 之 importsNotUsedAsValues 属性] ( https://blog.51cto.com/u_13028258/5754309 )
368
+
0 commit comments