Question

我试图了解打字稿模块编译器选项。

我阅读了打字稿文档-docs 它表示模块选项为Specify module code generation。

那是什么意思？

这是否意味着如果我将模块选项设置为commonjs，那么编译器会将代码编译为commonjs？但是然后我们有了诸如esnext, es16之类的选项。经过Docs: Difference between esnext, es6, es2015 module targets之后，我了解了import() expressions are understood in esnext。无论如何，编译器的目的是将代码编译成浏览器可理解的语法（commonjs）。因此，将代码编译为给定的模块类型没有意义。

那么这是否意味着您提供的模块类型告诉编译器以哪种语法编写代码？意味着必须从哪个代码将其编译为commonjs？但是然后我们有了commonjs模块类型，该模块类型经常使用，但是我们几乎从来没有用纯commonjs语法编写代码。

what is the purpose of tsconfig.json? stackoverflow回答说module specifies module manager。我不明白那是什么意思。

我也经历了Understanding “target” and “module” in tsconfig和tsconfig module options - does 'System' refer to SystemJS?。

这些似乎都不能正确回答我的问题。

tsconfig.json

{
  "compilerOptions: {
    "module": "esnext"
  }
}

Answer 1

TLDR； tsconfig.json中的module告诉编译器对发出的.js文件中的模块使用什么语法。常用的值为"commonjs"（require / module.exports）或"ES2015"（导入/导出关键字），但是还有其他模块系统。 module影响发出代码的模块语法，而target影响其余代码。

Specify module code generation是什么意思？

tsconfig.json中的

"module"告诉Typescript（TS）编译器什么模块语法在将文件编译为Javascript（JS）时使用。

在tsconfig.json中将"module"设置为"commonjs"时，这意味着已编译的.js文件中的模块将使用commonJS（CJS）语法，因此var x = require(...)和{ {1}}进行导入和导出。例如，如果将module.exports = {...}更改为"module"，则编译后的代码将使用ES2015模块语法中使用的"ES2015"和import关键字。有关其他语法的概述，请查看here。

CJS和本机ES模块（ESM）格式可能是使用最广泛的格式。选择什么取决于您的要求。如果用于服务器端项目如果使用的是Angular前端应用程序，则使用Node.js，然后可能使用CJS 可能不是ESM（或他们自己的NgModules，但这超出了范围）。类似的情况是库和包装设计以及您将如何喜欢将它们展示给消费者。这取决于要消费的用户类型代码，它们使用什么（浏览器，节点）以及哪些模块系统最适合这份工作？

ES Modules现在是用于在JS中导入/导出模块的内置标准，但是当没有本机解决方案时，就设计了其他模块系统：这就是为什么我们周围也有CJS，AMD和UMD模块的原因。它们并非都已经过时，Node.js中仍然使用CJS，例如AMD模块加载器允许非JS导入，这在某些情况下很有用。如今，所有现代浏览器和Node 13.2.0+都支持ESM格式（see this page for compatibility data and more background on modules）。

但是我们有esnext之类的选项

较新的JS版本有时包含用于模块导入/导出的更多功能。将export设置为"module"可以支持这些功能，而这些功能通常尚未添加到官方规范中。例如dynamic import的"ESNext"表达式。

这是否意味着如果我将模块选项设置为commonjs，那么编译器会将代码编译为commonjs？

import(...)设置不会影响其余代码，"module"则用于此设置，并指定输出应兼容的JS版本。其他线程已经对此进行了解释，为了清楚起见，我仅在此处添加它。假设您要在Node项目中使用"target"和require(...)，但还希望代码在代码中利用ES2015功能，例如module.exports = {...}和let（以提高可读性/性能/其他原因）。在这种情况下，您可以在tsconfig中将const设置为"module"，将"commonjs"设置为"target"。

无论如何，编译器的目的是将代码编译成浏览器可理解的语法（commonjs）。

是的，编译器必须将TS代码转换为浏览器可以理解的JS。但是，JS不再局限于浏览器，例如，Node在其他环境（服务器）中运行。实际上，CJS原本打算用作服务器端模块格式，而AMD模块则用于浏览器的导入/导出。

那么这是否意味着您提供的模块类型告诉编译器以哪种语法编写代码？

它告诉编译器以什么语法将模块写入输出的.js文件中

tsconfig中的模块选项用于什么？

1 个答案: