babel 6.0 的语法插件的作用

30. 十二月 2016 JavaScript, React 0

这里只是简单的介绍一下babel中那些语法插件的作用包括以下几个

babel-preset-react 的作用是让其支持JSX的语法。

babel-preset-es2015 的作用是让其支持ES6的写法。

babel-preset-stage-0 的作用比较多(法力无边),因为它包含stage-1, stage-2以及stage-3的所有功能,同时还另外支持如下两个功能插件

  • transform-do-expressions   作用是让JSX可以使用if/else表达式
  • transform-function-bind  作用是 :: 来设置this的指向,比较实用

if-Else 在JSX中的具体用法为

同时要在.bablerc 文件中preset使用 stage-0 或者 在plugin中使用transform-do-expressions,语法要使用do{}

 

 

babel-preset-stage-1 除了包含stage-2和stage-3,还包含了下面4个插件

  • transform-class-constructor-call  支持class的构造函数
  • transform-class-properties               支持class的static属性
  • transform-decorators                            支持es7的装饰者模式即@符号引入的方法 (还在讨论中的特性,不完善)
  • transform-export-extensions            支持export方法

babel-preset-stage-2 包括stage-3的所有插件,额外还包括以下插件:

  • syntax-trailing-function-commas 支持尾逗号函数
  • transform-object-reset-spread 支持对象的解构赋值

babel-preset-stage-3  包括以下插件

  • transform-async-to-generator  支持async/await
  • transform-exponentiation-operator 支持幂运算符语法糖

 


发表评论

电子邮件地址不会被公开。