<commit_before>---
layout: post
title: Everything you need to know about BabelJS
description: Babel is becoming the de-facto tool for compiling ES6/ES7 code to browser usable code. Here is all you need to know to become comfortable with Babel.  
---

![Babel Logo](http://kleopetrov.me/assets/images/posts/babel.jpg)

[Babel](https://babeljs.io) is a tool for transpiling (compiling) ES6/ES7 code to ECMAScript 5 code, which can be used **today** in any modern browser. Even more - Babel has extensions for transpiling JSX for React and Flow syntax for static type checking.
    
Babel is composed of various small modules. Out of the box, Babel doesn't do anything. It uses presets for compiling the code, which we will cover later on.
 
> **Note:** I assume you are comfortable using the command line and have installed [node](https://nodejs.org/en/) and [npm](https://www.npmjs.com/). Also make sure you have `package.json` in your project folder. More info - [npm init](https://docs.npmjs.com/cli/init) 
 
### babel-cli

Babel CLI is a tool for transpiling the code through the command line. While you can install it globally, using `npm install babel-cli -g`, it's recommended to install it locally project by project with `npm install babel-cli --save-dev`.

There are two main advantages for this:

1. Different projects on the same machine can depend on different versions of Babel. 
2. You don't have implicit dependency on the dev environment you are working on. Your project will be way more portable and maintainable.

After installing `babel-cli` and saved it as a dev dependency, you can run the following commands from the terminal: 

```
babel example.js --out-file compiled.js
```

Let's see what every piece of the command does:

- `babel` - calling Babel
- `example.js` - the input ES6/ES7 file
- `--out-file` - the option passed to Babel for compiling a file. We can also use `--out-dir` for compiling all files in a directory. The short versions of the options are `-o` for `--out-file` and `-d` for `--output-dir`<commit_msg>edit babel post description<commit_after>---
layout: post
title: Everything you need to know about BabelJS
description: Babel is becoming the de-facto tool for compiling ES6/ES7 code to browser usable code. Here is all you need to know to become comfortable with it.  
---

![Babel Logo](http://kleopetrov.me/assets/images/posts/babel.jpg)

[Babel](https://babeljs.io) is a tool for transpiling (compiling) ES6/ES7 code to ECMAScript 5 code, which can be used **today** in any modern browser. Even more - Babel has extensions for transpiling JSX for React and Flow syntax for static type checking.
    
Babel is composed of various small modules. Out of the box, Babel doesn't do anything. It uses presets for compiling the code, which we will cover later on.
 
> **Note:** I assume you are comfortable using the command line and have installed [node](https://nodejs.org/en/) and [npm](https://www.npmjs.com/). Also make sure you have `package.json` in your project folder. More info - [npm init](https://docs.npmjs.com/cli/init) 
 
### babel-cli

Babel CLI is a tool for transpiling the code through the command line. While you can install it globally, using `npm install babel-cli -g`, it's recommended to install it locally project by project with `npm install babel-cli --save-dev`.

There are two main advantages for this:

1. Different projects on the same machine can depend on different versions of Babel. 
2. You don't have implicit dependency on the dev environment you are working on. Your project will be way more portable and maintainable.

After installing `babel-cli` and saved it as a dev dependency, you can run the following commands from the terminal: 

```
babel example.js --out-file compiled.js
```

Let's see what every piece of the command does:

- `babel` - calling Babel
- `example.js` - the input ES6/ES7 file
- `--out-file` - the option passed to Babel for compiling a file. We can also use `--out-dir` for compiling all files in a directory. The short versions of the options are `-o` for `--out-file` and `-d` for `--output-dir`
{'fraction_non_alphanumeric': 0.08867235079171741, 'fraction_numerical': 0.00438489646772229, 'mean_word_length': 3.8305882352941176, 'pattern_counts': {'":': 0, '<': 3, '<?xml version=': 0, '>': 5, 'https://': 8, 'lorem ipsum': 0, 'www.': 2, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '4246724', 'n_tokens_mistral': 1192, 'n_tokens_neox': 1127, 'n_words': 594}