TypeScript学习-21 三斜线指令

本文详细介绍了TypeScript中的三斜线指令,包括预处理输入文件、引用处理、--noResolve选项、类型引用以及AMD模块相关指令。这些指令在编译过程中起到关键作用,如声明文件依赖、控制编译顺序和处理模块定义。正确理解和使用这些指令能有效优化TypeScript项目的构建流程。
摘要由CSDN通过智能技术生成

三斜线指令

三斜线指令是包含单个XML标签的单行注释。注释的内容会做为编译器指令使用。

三斜线指令仅可放在包含它的文件的最顶端。一个三斜线指令的前面只能出现单行或多行注释,这包括其它的三斜线指令。如果它们出现在一个语句或声明之后,那么它们会被当做普通的单行注释,并且不具有特殊的涵义。

/// <reference path="…" />

/// <reference path="…" />指令是三斜线指令中最常见的一种。它用于声明文件间的依赖。

三斜线引用告诉编译器在编译过程中要引入的额外的文件。

当使用–out或–outFile时,它也可以做为调整输出内容顺序的一种方法。文件在输出文件内容中的位置与经过预处理后的输入顺序一致。

预处理输入文件

编译器会对输入文件进行预处理来解析所有三斜线引用指令。在这个过程中,额外的文件会加到编译过程中。

这个过程会以一些根文件开始;它们是在命令行中指定的文件或是在tsconfig.json中的"files"列表里的文件。这些根文件按指定的顺序进行预处理。在一个文件被加入列表前,它包含的所有三斜线引用都要被处理,还有它们包含的目标。三斜线引用以它们在文件里出现的顺序,使用深度优先的方式解析。

一个三斜线引用路径是相对于包含它的文件的,如果不是根文件。

错误

引用不存在的文件会报错。一个文件用三斜线指令引用自己会报错。

使用 --noResolve

如果指定了–noResolve编译选项,三斜线引用会被忽略;它们不会增加新文件,也不会改变给定文件的顺序。

/// <reference types="…" />

与 /// <reference path="…" />指令相似,这个指令是用来声明依赖的;一个 /// <reference types="…" />指令则声明了对某个包的依赖。

对这些包的名字的解析与在import语句里对模块名的解析类似。可以简单地把三斜线类型引用指令当做import声明的包。

例如,把 /// <reference types=“node” />引入到声明文件,表明这个文件使用了@types/node/index.d.ts里面声明的名字;并且,这个包需要在编译阶段与声明文件一起被包含进来。

仅当在你需要写一个d.ts文件时才使用这个指令。

对于那些在编译阶段生成的声明文件,编译器会自动地添加/// <reference types="…" />;当且仅当结果文件中使用了引用的包里的声明时才会在生成的声明文件里添加/// <reference types="…" />语句。

若要在.ts文件里声明一个对@types包的依赖,使用–types命令行选项或在tsconfig.json里指定。查看在tsconfig.json里使用@types,typeRoots和types了解详情。

/// <reference no-default-lib=“true”/>

这个指令把一个文件标记成默认库。你会在lib.d.ts文件和它不同的变体的顶端看到这个注释。

这个指令告诉编译器在编译过程中不要包含这个默认库(比如,lib.d.ts)。这与在命令行上使用–noLib相似。

还要注意,当传递了–skipDefaultLibCheck时,编译器只会忽略检查带有/// <reference no-default-lib=“true”/>的文件。

/// <amd-module />

默认情况下生成的AMD模块都是匿名的。但是,当一些工具需要处理生成的模块时会产生问题,比如r.js。

amd-module指令允许给编译器传入一个可选的模块名:

amdModule.ts
///<amd-module name='NamedModule'/>
export class C {
}

这会将NamedModule传入到AMD define函数里:

amdModule.js
define("NamedModule", ["require", "exports"], function (require, exports) {
    var C = (function () {
        function C() {
        }
        return C;
    })();
    exports.C = C;
});

/// <amd-dependency />

注意:这个指令被废弃了。使用import “moduleName”;语句代替。

/// <amd-dependency path=“x” />告诉编译器有一个非TypeScript模块依赖需要被注入,做为目标模块require调用的一部分。

amd-dependency指令也可以带一个可选的name属性;它允许我们为amd-dependency传入一个可选名字:

/// <amd-dependency path="legacy/moduleA" name="moduleA"/>
declare var moduleA:MyType
moduleA.callStuff()

生成的JavaScript代码:

define(["require", "exports", "legacy/moduleA"], function (require, exports, moduleA) {
    moduleA.callStuff()
});
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

return str=xi

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值