Deu erro e agora?

As linguagens de programação, bibliotecas, frameworks, pacotes etc. acabam sofrendo atualizações e/ou “depreciações” em seus códigos/estruturas. Atualmente, no mundo da programação, onde temos equipes de programadores, sejam duas ou mais pessoas, ou até mesmo quando estamos estudando e fazemos aquele famoso git clone de um repositório, passamos por alguns problemas, pois as vezes pegamos um código antigo, e tentamos executar. Nessa hora começa a pipocar warnings na tela, nada funciona.

Bom, cada um tem uma forma de apresentar o erro e uma forma especifica de realizar as atualizações. Vamos tratar aqui nesse pequeno artigo de um deles, o Node e partindo do ponto que o erro não está no código em si, até por que nem iniciamos a aplicação.

Então nesse contexto, tentamos iniciar nossa aplicação, com o “npm start” , e nesse instante disparam um monte de warning no nosso terminal, dependendo de quantas dependências precisam ser atualizadas ou a quantidade de erro no código. Mas é nesse momento que temos que seguir uns passos para deixar tudo bonitinho para nossa aplicação subir, seja em produção ou até mesmo para estudo.

Mas e aí? O que fazemos? Por onde começamos?

1 - npm install

O primeiro passo é rodar o comando npm install no terminal para que as dependências listadas no package.json sejam instaladas como no exemplo:

Lembre-se que o package.json deve estar no diretório onde você irá executar o npm install 

2 - Outdated

Uma segunda causa, principalmente quando pegamos projetos antigos, que no mundo da programação dependendo do que estamos utilizando, 1 ano já é muita coisa, pode ter certeza de que algo mudou nesse período e a versão que está em seu package.json já está "fora de data". Para esse problema temos duas soluções.

A primeira, mas generalista e que nem sempre surte tanto efeito é utilizar o npm update. Essa solução não irá surtir efeito caso a dependência tenha uma atualização importante, mas ele ainda sim irá fazer uma varredura e tentará atualizar.

Já a segunda forma, mais eficiente e recomendada, é primeiro você verificar quais dependências estão desatualizadas, utilizando o npm outdated no terminal e no diretório de seu projeto, onde está localizado o package.json.

Ele retornará todos os pacotes desatualizados como mostrado abaixo:

Com isso podemos ver exatamente o que precisa ser atualizado e com isso usar o comando npm install nomedopacote@latest como podem ver aqui:

Após isso podemos rodar novamente o npm outdated e verificar se o pacote ainda consta na lista, caso não esteja o pacote foi atualizado com sucesso.

3 - NCU

Uma terceira opção é recorrer ao ncu, que é a sigla para NPM-CHECK-UPDATES, que eu considero a melhor forma de atualizar as dependências e que sempre utilizo em projetos ou estudos.

Primeiramente você deve instalar o pacote através do comando npm install -g npm-check-updates:

Depois disso você poderá rodar digitando ncu e ele fará uma varredura no seu package.json e irá retornar a lista completa do que precisa ser atualizado, como a seguir:

Lembrando que ele não irá atualizar as dependências com esse comando, ele irá atualizar o seu package.json. Para que ele faça todas as atualizações no seu arquivo package.json é necessário o comando ncu -u.

Há também o comando ncu -i onde a atualização se torna “interativa”, onde é possível percorrer cada item e selecionar o que deseja atualizar:

É possível ver o nível da "necessidade" de atualizar, de acordo com as cores, e usando o comando npm --interactive --format group, o ncu irá separar por grupo de necessidade, ou seja o que é uma atualização importante, uma atualização de uma "feature" ou até pequenas correções, como visto a seguir:

Então, após rodar o ncu, você deve rodar o npm install pois seu arquivo package.json já estará atualizado com a ultima versão de cada dependência de seu projeto.

Mas qual a diferença de se utilizar o ncu?

Quando você utiliza o npm outdated ele não te traz toda a lista, como visto nos exemplos, o styled-components não estava sendo mostrado na lista de atualizações, e mesmo que estivesse, você teria que usar o npm install nomedopacote@latest para cada dependência de seu projeto, se a lista for um pouco extensa, isso irá consumir um certo tempo. Com o ncu, você atualiza o seu package.json e com o npm install ele já instala as versões atualizadas de todas as dependências.

Bom com esses passos parte dos problemas, ao começar a trabalhar ou estudar um projeto que já tenha um certo tempo, estará resolvido, pois existem outros problemas como por exemplo no React que o componente <Switch> do react-router-dom foi substituído pelo componente <Routes>, sendo assim mesmo que sua dependência esteja atualizada o seu código irá quebrar pois existe um trecho com código "depreciado", mas isso é papo para outro artigo.

Bons estudos e bons projetos!