What is Babel?---JSX and React

Babel is a JavaScript compiler

Babel is a toolchain that is mainly used to convert ECMAScript 2015+ code into a backwards compatible version of JavaScript in current and older browsers or environments. Here are the main things Babel can do for you:

• Transform syntax
• Polyfill features that are missing in your target environment (through @babel/polyfill)
• Source code transformations (codemods)
• And more! (check out these videos for inspiration)

// Babel Input: ES2015 arrow function

[1, 2, 3].map((n) => n + 1);

 

// Babel Output: ES5 equivalent

[1, 2, 3].map(function(n) {

  return n + 1;

});

the-super-tiny-compiler, which also explains how Babel itself works on a high level.

 

JSX and React

Babel can convert JSX syntax!

 

Type Annotations (Flow and TypeScript)

Babel can strip out type annotations! Check out either our Flow preset or TypeScript preset to get started. Keep in mind that Babel doesn't do type checking; you'll still have to install and use Flow or TypeScript to check types.

 

https://babeljs.io/docs/en/index.html#jsx-and-react

 

Babel是React团队选择的在使用React过程中转换ES*和JSX为ES5语句的工具，可以从Babel handbook了解Babel详细的用法。

实际上，Babel的主要用途并非一个JSX语句转换器。Babel主要用途是一个JavaScript转换器，它可以转换各种ES*代码为浏览器可识别的ES代码。就目前来说，Babel主要会转换ES6和ES7语句为ES5语句，转换JSX看起来倒像是其的一个附加功能。

 

babel的浏览器版本为browser.js（未精简）和browser.min.js（已精简）
---------------------
作者：abloume
来源：CSDN
原文：https://blog.csdn.net/u013451157/article/details/78946375
版权声明：本文为博主原创文章，转载请附上博文链接！