编译 TypeScript 文件

已完成

如前文所述,TypeScript 是 ECMAScript 2015(ECMAScript 6 或 ES6)的严格超集。 所有 JavaScript 代码也是 TypeScript 代码,而 TypeScript 程序可以无缝地使用 JavaScript。 事实上,你只需将扩展从 .js 重命名为 .ts,即可将 JavaScript 文件转换为 TypeScript 文件。

但并非所有的 TypeScript 代码都是 JavaScript 代码。 TypeScript 向 JavaScript 添加了新语法,从而使 JavaScript 更易于读取和实现某些功能,如静态类型化。 虽然 TypeScript 代码会使得开发更容易且更不容易出错,但浏览器和大多数其他运行时本身并不支持 TypeScript。 为此,TypeScript 需要一个生成步骤 (transpiler),以将其转换为 JavaScript,便于应用程序正常工作。

你可以使用 TypeScript 编译器或使用与 TypeScript 兼容的转译器(例如 BabelswcSucrase)将 TypeScript 代码转换为 JavaScript 代码。 此过程将删除特定于 TypeScript 的代码(例如类型声明和接口)。 此外,它还会生成一个可从网页中运行的干净 JavaScript 文件,并且该文件与浏览器兼容。

编译 TypeScript 文件

在命令提示符下使用 tsc 命令运行 TypeScript 编译器。 在不使用参数的情况下运行 tsc 时,它将编译当前文件夹中的所有 .ts 文件,并为每个文件生成一个 .js 文件。

你也可以编译特定的文件。 例如,若要编译名为 utility_functions.ts 的 TypeScript 文件,请输入 tsc utility_functions.ts

备注

输入 .ts 文件扩展名是可选操作。

如果没有任何编译器错误,则 tsc 命令会生成一个名为 utility_functions.js 的 JavaScript 文件。

如果编译器在代码中发现错误,则会在命令窗口中显示这些错误。 修复 TypeScript 文件中的错误,然后重新运行 tsc 命令。

编译器选项

使用编译器选项,可以控制如何从源 TypeScript 生成 JavaScript。 你可在命令提示符处(就像在许多命令行界面中一样)设置选项,也可以在名为 tsconfig.json 的 JSON 文件中设置选项。

有许多编译器选项可供选择。 在 tsc 命令行接口文档中可以找到选项的完整列表。 以下介绍了一些最常见的方式:

  • noImplicitAny
  • noEmitOnError
  • target
  • 目录选项

若要控制编译,可以将编译器选项与 tsc 命令一起使用,包括:

  • --noImplicitAny 选项,指示编译器对具有隐含的 any 类型的表达式和声明引发错误。 例如:

    tsc utility_functions.ts --noImplicitAny

  • --target 选项,为 JavaScript 文件指定 ECMAScript 目标版本。 此示例编译与 ECMAScript 6 兼容的 JavaScript 文件:

    tsc utility_functions.ts --target "ES2015"

你将在后面的模块中了解其他编译器选项。