javascript - tsconfig 中的模块选项是用来做什么的？

Question

我正在尝试了解 typescript 模块编译器选项。

我浏览了 typescript 文档 - 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； module在 tsconfig.json 中告诉编译器对发出的 .js 文件中的模块使用什么语法。常用值为"commonjs" (require/module.exports) 或 "ES2015" (导入/导出关键字)，但还有其他模块系统。 module影响发出代码的模块语法，而 target影响其余部分。

Specify module code generation 是什么意思意思是？

"module"在 tsconfig.json 中告诉 Typescript (TS) 编译器什么模块语法
在文件编译为 Javascript (JS) 时使用。
当您设置 "module"至 "commonjs"在 tsconfig.json 中，这意味着编译后的 .js 文件中的模块将使用 commonJS (CJS) 语法，所以 var x = require(...)和 module.exports = {...}进口和导出。
如果您更改了 "module"至 "ES2015"例如，编译后的代码将使用 import和 export ES2015 模块语法中使用的关键字。有关其他语法的概述，您可以查看 here .
有几个不同的模块系统与 CJS 和
native ES 模块 (ESM) 格式可能是最广泛使用的格式。
选择什么取决于您的要求。如果是服务器端项目
使用 Node.js 然后可能是 CJS，如果它用于 Angular 前端应用程序
也许比 ESM(或他们自己的 NgModules，但这超出了这里的范围)。
有点类似的情况是库和包设计以及您将如何
喜欢将它们展示给消费者。这取决于要消费的用户类型
代码，它们使用什么(浏览器，节点)以及哪些模块系统
最适合这份工作？
ES 模块现在是在 JS 中导入/导出模块的内置标准，但在没有原生解决方案的时候设计了其他模块系统:这就是我们周围还有 CJS、AMD 和 UMD 模块的原因。它们并不是都过时了，CJS 在 Node.js 中仍然被大量使用，例如 AMD 模块加载器允许非 JS 导入，这在某些情况下很有用。
如今，所有现代浏览器和 Node 13.2.0+ 都支持 ESM 格式( see this page for compatibility data and more background on modules)。
但是我们有像 esnext 这样的选项。
较新的 JS 版本有时包含更多的模块导入/导出功能。
设置 "module"至 "ESNext"启用对这些通常尚未添加到官方规范中的功能的支持。如 import(...)表达式是 dynamic import .
这是否意味着如果我将模块选项设置为commonjs，那么编译器会将代码编译为commonjs？ "module"设置不影响其余代码， "target"而是用于此，并指定输出应兼容的 JS 版本。
这已经在其他线程中进行了解释，为了清楚起见，我只是在这里添加它。
说你想用 require(...)和 module.exports = {...}在 Node 项目中，但还希望代码利用 ES2015 功能，如 let和 const在代码中(出于可读性/性能/其他原因)。
在这种情况下，您将设置 "module"至 "commonjs"和 "target"至 "ES2015"在 tsconfig.
无论如何，编译器的目的是将代码编译成浏览器可理解的语法(commonjs)。
是的，编译器必须将 TS 代码转换为浏览器可以理解的 JS。
但是，JS 不再局限于浏览器，例如 Node 运行在其他环境(服务器)中。 CJS 实际上旨在作为服务器端模块格式，而 AMD 模块用于/用于浏览器导入/导出。
那么这是否意味着您提供的模块类型会告诉编译器代码是用什么语法编写的？
它告诉编译器以什么语法将模块写入输出 .js 文件