Babel Transpiler in ES6

 

Babel is the transpiler for Es6. Babel transpile the Es6 code back to the ES5(Plain javascript) code

So that all browsers can understand. Few old version browsers can not be able to understand the ES6 command. So with the help of babel we are converting the ES6 back to ES5

 

How to run the es6 code  in nodejs. How to transpile ES6 back to ES5 using babel

 

1)Create project folder

 

2)Inside project folder run

npm init

 

3)Now install babel-cli –save-dev (development mode)

npm i babel-cli –save-dev

 

4)again , install  babel-preset-latest. (It contains all preset-2015 , 2016.2017)

npm i babel-preset-latest –save-dev 

 

5)create a src folder. Put our es6 code inside it

index.js

import person from ‘./a1’;

person.getName();

 

a1.js

let person = {

   firstName : ‘Mohan’,

   lastName  : “Kumar”,

   getName : ()=>{

       console.log(`The name is ${person.firstName}${person.lastName}`);

   }

}

export default person;

 

6)configure the package.json

“scripts” : {

“build” : “babel src -d dist”

}

Note : Above command will compile the file inside the src folder then dump it inside the dist folder

 

7)Create configuration file for babel

{
    “presets”: [“babel-preset-latest”]
}

 

8)npm run build

 

9)Once the dist folder gets created after the npm run build command , 

Run the js file inside dist folder through :

 

node file_name.js

Site Footer