Como atualizar todas as dependências Javascript de uma só vez?

Flávio Conca
QODA
3 min readMar 27, 2024

--

Se ainda não passou por isso em sua vida, você vai passar em algum projeto mais antigo e que precisará desta manutenção e ter todas as dependências atualizadas.

E se você ainda nunca fez isso já te adianto: é um processo chato.

Infelizmente não existe em projetos Javascript nenhuma ferramenta que faça estas atualizações automaticamente, assim como existe o modo “atualização automática” das extensões e plugins no WordPress.

Mas, existe alternativa que auxilia na produtividade desta tarefa. Há formas de saber e identificar quais pacotes instalou via NPM estão desatualizados sem precisar ficar entrando na página de um por um.

Isso já ajuda bastante, vai!

NPM outdated

Está é a primeira forma de identificar pacotes desatualizados. Esse é o modo "nativo" do próprio NPM:

npm outdate

Basta executar npm outdated na pasta do projeto e pronto! Você vai receber uma lista com tudo que estiver desatualizado por ali:

NPM outdate

Você vai poder visualizar qual pacote instalado via NPM está sendo usado na versão atual, ou seja a coluna Current exibe a versão usada em seu projeto. A coluna Wanted é a versão apropriada, ou seja, a versão esperada para estar em uso no seu projeto. Já a coluna Latest, exibe a última atualização do pacote disponível via NPM.

npm-check-updates

Outra solução é um pacote chamado npm-check-updates, assim como o npm outdated, ele faz uma varredura no package.json procurando por dependências desatualizadas. Nesse caso, é só executar esse comando:

npx npm-check-updates

Agora vai ver as mesmas coisas, mas ordenado diferente usando Yarn.

E qual usar?

A resposta é: qualquer um!

Ambos servem para o mesmo propósito que é identificar dependências desatualizadas em projetos (e existem várias outras opções, como o npm-check).

A diferença é que nesses pacotes são implementadas funcionalidade extras que não existem no npm outdated, como por exemplo: no npm-check-updates, se executarmos o comando com a flag -u (npx npm-check-updates -u), além de identificar os pacotes desatualizados ele também atualiza o package.json pra gente. Então, novamente: pode escolher qualquer um que está tudo certo. Meu único conselho é: consulte a documentação do pacote antes de atualizar. Alguns pacotes acabam aderindo ao uso do TyprScript e a forma de atribuir funções e métodos pode ser alterada. Recomendo fortemente fazer uma cópia do seu projeto ou versionar ele em uma nova branch no repositório para não ter problema com projetos em produção e não precisar perder os cabelos com algo simples.

Boa sorte!

--

--