The JavaScript world is changing and ES6 is rapidly taking over. Many famous frameworks like AngularJS 2 and React Native have already started supporting ES6. It's important that we are prepared for this change. To do so, we need to start writing code that uses ES6 even before the support for it lands in all browsers. In this article, I'll show you how to set up a project that integrates Babel and Browserify to write modern code that can be executed by older browsers as well. Babel compiles ES6 code into ES5 which is supported by many browsers, including old ones like Internet Explorer 9, and Browserify is a tool for writing code that follows the CommonJS pattern and packaging it to be used in the browser.
Creating the package.json file
First of all, let's see the folder structure of the demo we are going to make
Project root/
|-- dist/
|-----modules.js
|-- modules/
|-----import.js
|-----index.js
|--Gruntfile.js
|--package.json
In the project's root folder, there are two files Gruntfile.js and package.json and two folders modules and dist. The modules folder contains all the modules written in ES6 and the dist folder contains the bundled and compiled ES5 JavaScript file. I have excluded .gitignore as it is just a utility file which in no way affects the project. Now, let's start by creating the package.json file. There are many fields in a typical package.json file like description, version, author, and others, but in this project we're only using the important ones.
Continue reading %Setting up an ES6 Project Using Babel and Browserify%
by Ritesh Kumar via SitePoint
