为什么一些使用typescript / webpack的项目也使用babel来完成编译

时间:2017-07-17 05:17:59

标签: javascript typescript webpack webpack-2 babel

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

是否该项目还有js需要编译,所以他们只是使用babel的一切?或者我错过了什么?

感谢。

3 个答案:

答案 0 :(得分:4)

有几个可能的原因。

  1. 他们使用Babel自动填充 - TypeScript只执行语法转换,让用户找出他们需要的运行时库(例如Promise,{ {1}}等)。这允许您决定这些polyfill的哪种实现最适合您,但这可能会很痛苦。巴别塔让你无后顾之忧。这是一种权衡。
  2. 他们需要自定义转换 - TypeScript有一个转换管道,但只有在此时使用TypeScript API时才能访问它。如果您已经在使用Babel并且想要开始使用TypeScript,但是您已经在使用转换,那么这是一个合理的妥协。
  3. 它是在TypeScript不支持将生成器编译到ES5时创建的(甚至在TypeScript不支持ES5中的Symbol / async时返回) - TypeScript具有自2.1以来在ES5中支持await / async,并且自2.3以来支持await标志后面的生成器。在此之前,用户经常依靠Babel来获取松弛,但此处不再需要Babel。
  4. 它是在Webpack 2之前创建的,项目使用了特定的导入模块的方式 - TypeScript有一个downlevelIteration选项,告诉TypeScript默认导入可用于导入某些模块。 Babel支持这种行为,但是在Webpack 2问世之前,Webpack并没有。对于较新版本的Webpack,不再需要使用Babel。
  5. 这可能不是一套完整的理由,但是我能想到的是一些原因。

答案 1 :(得分:0)

  

为什么不直接使用ts编译成es5?

这就是我的工作。

关于混合Babel和TypeScript

将两者结合使用没有任何缺陷。既然都这样做:

 (non js OR js) => standard js

你可以做到

 (non js OR js) => standard js => es5 

TS -> JS -babel> ES5Babel -> JS -ts> ES5

人们这样做的原因是各种语法支持:https://kangax.github.io/compat-table/

个人

如上所述。我不使用Babel as I TypeSafety is big for me and don't need to use syntax that isn't yet type safe

答案 2 :(得分:0)

打字稿是从ES2016开始的演变。 Typescript帮助c#和java后台的开发人员成为使用各种工具的javascript开发人员。 Visual Studio代码,WebStorm,Sublime等。

为什么:我们不能单独使用Typescript将ts转换为ES5   使用TypeScript编译为ES5并不像Babel那样完整。某些现代语言功能(如Array.prototype.find)无法使用TypeScript编译为ES5。

以下是可以帮助您的链接:https://www.stackchief.com/blog/TypeScript%20or%20Babel%3F