Instalação e configuração do Babel

Em nossa configuração do webpack, especificamos que queríamos usar o babel-loader. Para utilizá-lo precisar instalar e depois fazer algumas configurações.

$ yarn add babel-loader babel-core babel-preset-es2015 babel-preset-react --dev

Essas são as dependências que precisamos para o Babel. Note que instalamos babel-preset-es2015 e babel-preset-react. Presets são plugins do Babel que simplesmente dizem para o Babel o que procurar para transformar em Javascript.

Precisamos configurar o Babel e fazemos isso criando um novo arquivo chamado .babelrc. Abra-o em algum editor.

Linux/MAC:

$ touch .babelrc

Windows:

> type NUL > .babelrc

Agora atualize para que fique dessa forma:

{
    "presets":[
        "es2015", "react"
    ]
}

É isso. Agora quando o babel-loader for chamado no webpack, ele sabe o que precisa ser feito.