javascript - 为什么有些项目用了typescript/webpack也用babel完成编译

Question

我注意到一些使用 typescript 和 webpack 的 web 项目也使用 babel 来完成编译。比如他们用ts编译成ES2015，然后用babel编译成es5。为什么不直接用ts编译成es5呢？

是不是项目里也有js需要编译，就全部用babel了？或者我错过了什么？

谢谢。

Answer 1

这有几个可能的原因。

1. 他们使用 Babel 来自动填充 - TypeScript 只执行句法转换，让用户弄清楚他们需要使用哪些运行时库(例如 Promise、符号等)。这允许您决定这些 polyfill 的哪种实现最适合您，但这可能会很痛苦。 Babel 让你免于思考这个问题。这是一种权衡。
2. 他们需要它来进行自定义转换 - TypeScript 有一个转换管道，但只有在您此时使用 TypeScript API 时才能访问它。如果您已经在使用 Babel 并想开始使用 TypeScript，但您已经在使用转换，这是一个合理的折衷方案。
3. 它是在 TypeScript 不支持将生成器编译为 ES5 时创建的(甚至在 TypeScript 不支持 ES5 中的 async/await 时创建) - TypeScript 从 2.1 开始支持 ES5 中的 async/await，并且从 2.3 开始支持 downlevelIteration 标志后面的生成器。在此之前，用户经常依赖 Babel 来弥补不足，但现在不再需要 Babel。
4. 它是在 Webpack 2 之前创建的，并且该项目使用了一种特定的导入模块的方式 - TypeScript 有一个 allowSyntheticDefaultImport 选项，它告诉 TypeScript 可以使用默认导入来导入某些模块。 Babel 支持这种行为，但 Webpack 直到 Webpack 2 出来才支持。较新版本的 Webpack 不再需要 Babel。

这可能不是全部原因，但这是我能想到的一些原因。