Babel “How to use it without using it?

Written by Pham Quang Hung

Javascript and browser

As you know, javascript, with the current dynamic community, is growing very crazy. The birth of ES6 brought a lot of interesting things like:

• "Fat arrow" minimizes the syntax of the function
• or as a "promise" to clear out the problem of callbacks
• or a "let" that replaces "var" sida
• …

In the near future, ES7 is going out and ES8 has concepts. Javascript is so fast, but the slow is not a lazy dev (probably ..), but simply the browser does not accept …

In order to be able to run code with the new ES6 syntax, the necessary condition is that the browser must support it, you can see the list of browsers that have caught up with the time via the following detailed website (and will not many people are surprised that IE does not support the distortion very much, red from top to bottom ..)

So what?

Because browsers are not uniform, few dare to use the new ES6 syntax. Because I missed it, I finished writing a good run on firefox, so I got sick when I tested in IE. So, just use the old one (ES5) for good …

Or! There is a tool, convert ES6 code you write, to old ES5 code. There is a tool that does the conversion with just three simple commands. There is a tool that can convert not only ES6, but also convert both Typescript, Coffeescript, etc.

Maybe you are interested

Learn right away Javascript because it will still be the most popular language 2019

6 user authentication JavaScript libraries for 2019

Babel

~> "Why is it so simple, every step has a lot of messy miscellaneous things?" It really looks a little messy, but it is all to help Babel do the things promised above, if inhaled. slightly deep and careful, we will see that it is not complicated:

• The @babel / cli is to "make the conversion with only three simple statements"
• The @babel / polyfill provided to Babel is capable of converting code for both ancient browsers to understand.
• The @babel / core is the foundation for flexible assembly of "accessories". In particular, the "accessories" include: @babel / preset-env to convert ES5 ++ to ES5 @babel / babel-preset-react to convert JS of React to ES5 @babel / preset-typescript to convert Typescript to Javascript ES5 … So, if you need to convert something into Javascript ES5, simply install more "accessories" for Babel to work, very gently and without sweat.

Conclusion

That's it, we don't need to wait for the bad browser to update it any more, now we can use all the cool new cool Javascript features without worrying. All have Babel to worry, please give Babel a little time here!