Configurando babel em projetos NodeJS + Express

Antônio Silva
2 min readMar 6, 2022

Com a inclusão de novas funcionalidade e recursos do ECMAScript que acontece anualmente, é sempre uma boa prática manter o código em evolução junto as novas especificações da linguagem.

Os navegadores demoram um pouco mais para incluir essas novas funcionalidades em seus motores, isso não acontece frequentemente com o NodeJS, mas caso você utilize uma versão mais antiga dessa ferramenta, o babel pode nos ajudar com isso!

Vamos lá!

SETUP

Para nosso projeto funcionar corretamente com as novas funcionalidade, precisamos instalar alguns pacotes em nosso projeto.

  • babel-core — o babel-core é o pacote principal para executar qualquer instalação ou configuração do babel
  • babel-preset-env — este pacote é usado para fazer uso de recursos futuros que o node.js não conseguia entender. por exemplo, algum recurso será novo e demorará para ser implementado no node.js por padrão.

Vamos executar o seguinte comando:

Instalação dev babel

CRIANDO O ARQUIVO DE CONFIGURAÇÃO babel.config.json

Crie um arquivo chamado babel.config.json na raiz do seu projeto e habilite algumas predefinições.

Predefinições essas que fazem o babel ser útil para diversos frameworks e outras funcionalidades.

Para começar, você pode usar a predefinição de env, que permite transformações para ES2015+

Arquivo babel.config.json

nodemon

nodemon é uma ferramenta que ajuda a desenvolver aplicações baseados em NodeJS reiniciando automaticamente a aplicação quando mudanças são detectadas no projeto.

Instalação do nodemon

Development mode

Agora, a configuração está pronta. precisamos criar um script que transpile nosso código em tempo de execução.

Para isso vamos adicionar o seguinte script em nosso arquivo package.json

Script de desenvolvimento

MODO PRODUÇÃO

Na produção, não podemos transpilar códigos em tempo de execução. portanto, o que precisamos fazer é compilar o código em vanilla javascript e implantar a versão compilada no servidor de produção node.js.

Sign up to discover human stories that deepen your understanding of the world.

Free

Distraction-free reading. No ads.

Organize your knowledge with lists and highlights.

Tell your story. Find your audience.

Membership

Read member-only stories

Support writers you read most

Earn money for your writing

Listen to audio narrations

Read offline with the Medium app

Antônio Silva
Antônio Silva

Written by Antônio Silva

Sou Analista Desenvolvedor Especialista 👨‍💻; Sou um grande apaixonado na programação mobile e um grande sonhador com o futuro progressivo das PWA;

No responses yet

Write a response