ES6 (ECMAScript 2015) is the latest stable version of JavaScript. It includes new language syntaxes and implementations for the language. Three years later implementation of these new features in JavaScript engines is still ongoing but you'd still like to write your code in ES6 because who wants to stay behind in this industry.
We'd be using Babel here to convert our ES6 code that can be understood by the existing Javascript engines. Babel is a compiler that allows us to write ES6 features in JavaScript and run it in the older/existing engines.
How to set up Babel with your Node.js App
- You should have the latest node.js installed and running on your machine.
Create a new project or run and move to this directory
$ mkdir new_project
$ cd new_project
Create a file
app.jsand write some ES6 code in there
import request from 'requests';
let helloWorld = 'Hello World!`;
console.log(`${helloWorld} this is some ES6 JavaScript code`);
Create a
package.jsonfile by runningnpm init. Enter the required details or press return for fields you do not recognise. At this point yourpackage.jsonshould look like this
{
"name": "es6project",
"version": "1.0.0",
"description": "using babel with node",
"main": "app.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"author": "",
"license": "ISC"
}
- Install babel and babel preset as a dev dependency
$ npm install -D babel-cli
$ npm install -D babel-preset-es2015
- Babel uses different plugins to enable different features. In our case we can use the es2015 plugin. We will need to create a
.babelrcconfiguration file.
$ touch .babelrc
and paste the following in the file
{
"presets": ["es2015"]
}
- Create an npm build command to compile your ES6 Javascript. Modify your
package.jsonwith
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
"build": "babel --presets es2015 -d lib/ src"
}
this compiles all of your ES6 code in the src directory to the lib directory.
You should see your code compiled in the lib directory and now you are good to go and run this.This code is present in the this Github repository.
This post was originally published on medium
Oldest comments (8)
Why not use typescript instead? (Maybe I just can't get away from my love of strongly typed languages)
afaik typescript also needs a compiler no? babel has a typescript plugin too.
Technically, yes. But, to me it is much more seamless with everything I've needed so far bundled with TS. It feels less cobbled together than using Babel, Webpack, or Rollup. Plus, it essentially automatically stays updated as new language features are added.
There is that problem of Typescript sucking ass though...
I think in 2018 you would want to avoid transpiling your code to ES5 as the support for it is already there.
Node v8 and v10 are pretty much on par with the latest ES20XX and if you are using Node v6 you still get most of the es2015 goodies except for async/await, double check on node.green.
If you are using something below v6, you have bigger things to worry about anyway...
Not all es6 features are implemented and they are behind the flag and in the experimentation, you have to use the
.mjsextension to use it.The latest v10 will have it all the features in it including the dynamic imports. But v10 still won't be the LTS version and not everyone will be using it.
My point is that you don't need Babel to use modern ES6 features. If you could tell me which ES6 feature you are getting by using Babel. If you are talking about ESM (EcmaScript Modules), Babel doesn't really give you ESM it simply allows you to write the
import x from ystyle and transpiles it back to CJS.I'm using Node 10.16.0. Is ESM best way to enable ES6 for NodeJS? (I currently use 'nodemon -r esm')
thanks!