Babel

Question 1

What is Babel?

Answer 1

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.

Question 2

What is a Plug-in?

Answer 2

A software component that adds a specific feature or customization to an existing computer program

Question 3

What is a Webpack loader?

Answer 3

Loaders are transformations that are applied to the source code of a module. They allow you to pre-process files as you import or “load” them. Thus, loaders are kind of like “tasks” in other build tools and provide a powerful way to handle front-end build steps. Loaders can transform files from a different language (like TypeScript) to JavaScript or load inline images as data URLs. Loaders even allow you to do things like import CSS files directly from your JavaScript modules.

Question 4

How can you make Babel and Webpack work together?

Answer 4

Install webpack, webpack-cli, @babel/core, @babel/plugin-transform-block-scoping, @babel/plugin-transform-arrow-functions as devDependencies
Then “build” script with npm run
Main.js generated by Webpack will have babel compiled JavaScript from index.js