Shulou(Shulou.com)06/03 Report--

This article mainly introduces the example analysis of TypeScript triple slash instruction, which is very detailed and has certain reference value. Friends who are interested must finish it!

Preface

TypeScript is a superset of Javascript that implements the use of Javascript in object-oriented programming. Of course, in the end, the code is compiled to Javascript.

The three-slash instruction is a single-line comment that contains a single XML tag. The contents of the comment are used as compiler instructions.

The three-slash instruction is valid only at the top of its included file. Triple slash instructions can only precede single-line or multiline comments, including other triple slash instructions. If you encounter them after a declaration or declaration, they are treated as regular one-line comments and have no special meaning.

/ / /

/ / instructions are the most common in this group. It acts as a dependency declaration between files.

The slash reference instructs the compiler to include other files during compilation.

They can also be used as a way to sort output when using-out or-outFile. After preprocessing delivery, the file is sent to the output file location in the same order as the input.

The process starts with a set of root files; these are the file names specified on the command line or in the "files" list of the tsconfig.json file. These root files are preprocessed in the specified order. Before adding a file to the list, all triple slash references in it are processed and their targets are included. Triple slash references are resolved in a depth-first manner in the order they see in the file.

If there is no root, the three slash reference path is resolved relative to the included file.

Error

It is wrong to reference a file that does not exist. If the file has a three-slash reference to itself, an error will occur.

Use-noResolve

If the compiler flag-noResolve is specified, three slash references are ignored; they neither cause new files to be added nor change the order of the files provided.

/ / /

Similar to the / / directive, this directive is used as a dependency declaration; however, the / / directive declares a dependency on the package.

The process of parsing these package names is similar to the process of resolving module names in an import statement. A simple way to consider a triple slash reference type instruction is as an import of the declaration package.

For example, include / in the declaration file that this file uses the name declared in types/node/index.d.ts; therefore, this package needs to be included in the compilation along with the declaration file.

These directives are used only when creating d.ts files manually.

For declaration files generated during compilation, the compiler automatically adds / / for you, and adds / in the generated declaration file only if and only if the generated file uses any declaration in the reference package.

/ / /

This directive allows files to explicitly include existing built-in lib files.

The built-in lib file is referenced in the same way as the "lib" compiler option in tsconfig.json (for example, using lib= "es2015" instead of lib= "lib.es2015.d.ts", and so on).

For declaration file authors who relay on built-in types, for example, it is recommended to use DOM API or built-in JS runtime constructors (such as Symbol or Iterable, with three slashes referencing the lib directive). Previously, these .d.ts files had to add this type of forward / duplicate declaration.

For example, adding / / to a file in compilation is equivalent to compiling with-lib es2017.string.

/ / "foo" .padStart (4)

/ / /

This directive marks the file as the default library. You will see this comment at the top of lib.d.ts and its different variants.

This directive instructs the compiler not to include the default library (that is, lib.d.ts) in the compilation. The effect here is similar to passing-noLib on the command line.

Also note that when passing-skipDefaultLibCheck, the compiler will only skip the use of / to check the file.

/ / /

By default, the AMD module is generated anonymously. This can cause problems when using other tools to deal with the result module, such as a bundler (such as r.js).

The amd-module directive allows you to pass the optional module name to the compiler:

AmdModule.ts

/ export class C {}

Will cause the name NamedModule to be assigned to the module as part of the calling AMD definition:

AmdModule.js

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

/ / /

Note: this instruction has been deprecated. Use import "moduleName"; instead declare.

/ notifies the compiler of the non-TS module dependencies that need to be injected into the require call of the resulting module.

The amd-dependency directive can also have an optional name attribute; this allows you to pass the optional name that the amd depends on:

/ declare var moduleA:MyTypemoduleA.callStuff ()

The generated JS code:

Define (["require", "exports", "legacy/moduleA"], function (require, exports, moduleA) {moduleA.callStuff ()}); the above is all the content of the article "sample Analysis of TypeScript Triple slash instruction". Thank you for reading! Hope to share the content to help you, more related knowledge, welcome to follow the industry information channel!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.