Artigo original: npm vs npx — What’s the Difference?

Se você já usou o Node.js, já deve ter usado o npm, certamente.

O npm (node package manager) é o gerenciador de dependências/pacotes que você recebe ao instalar o Node.js. Ele fornece um modo para os desenvolvedores instalarem pacotes, tanto em nível global quanto local.

Às vezes, você pode querer conferir um pacote específico e experimentar com alguns comandos. Não é possível, no entanto, fazer isso sem instalar as dependências em sua pasta node_modules local.

É aí que entra o npx.

Neste artigo, veremos as diferenças entre o npm e o npx e aprenderemos o que há de melhor em cada um.

Primeiro, vamos entender o que é, de fato, o npm e o que podemos fazer com ele.

Quer assistir um vídeo para complementar sua leitura? Confira:

npm: o gerenciador de pacotes

O npm, em primeiro lugar, é um repositório on-line para a publicação de projetos do Node.js em código aberto.

Em segundo, ele é uma ferramenta de interface de linha de comando, CLI, que auxilia a instalação desses pacotes e gerencia suas versões e dependências. Há centenas de milhares de bibliotecas e aplicações do Node.js no npm e muitas outras são adicionadas a cada dia.

O npm, por si só, não executa os pacotes. Se você quiser executar um pacote usando o npm, deve especificar aquele pacote em seu arquivo package.json.

Quando os executáveis são instalados por meio de pacotes do npm, ele cria links para eles:

  • instalações locais têm links criados no diretório ./node_modules/.bin/
  • instalações globais têm seus links criados no diretório global bin/ (por exemplo: /usr/local/bin, no Linux, ou em %AppData%/npm, no Windows)

Para executar um pacote com o npm, você precisa digitar o caminho local, assim:

$ ./node_modules/.bin/seu-pacote

Como alternativa, você pode executar um pacote instalado localmente adicionando-o ao seu arquivo package.json na seção de scripts, assim:

{
  "name": "sua-aplicacao",
  "version": "1.0.0",
  "scripts": {
    "your-package": "seu-pacote"
  }
}

Em seguida, você pode executar o script usando npm run:

npm run seu-pacote

É possível observar que executar um pacote com o npm puro exige um pouco de trabalho.

Felizmente, é aí que o npx passa a ser útil.

npx: o executor de pacotes

Desde a versão 5.2.0 do npm, o npx vem integrado a ele. Desse modo, ele passou a ser um padrão nos dias de hoje.

O npx também é uma ferramenta de interface de linha de comando, cujo propósito é facilitar a instalação e o gerenciamento de dependências hospedadas no registro do npm.

Agora, é muito fácil executar qualquer tipo de executável com base no Node.js que você instalaria normalmente por meio do npm.

Você pode executar o comando a seguir para ver se ele já está instalado em sua versão atual do npm:

$ which npx

Se não estiver, você pode instalá-lo assim:

$ npm install -g npx

Tão logo você tenha a certeza de que tem o npx instalado, vamos ver alguns dos casos de uso que tornam o npx extremamente útil.

Executar um pacote instalado localmente com facilidade

Se quiser executar um pacote instalado localmente, tudo o que precisa fazer é digitar:

$ npx seu-pacote

O npx verificará se o <comando> ou o <pacote> existe no $PATH ou nos arquivos binários do projeto local. Se estiver, eles o executarão.

Executar pacotes que não estavam instalados previamente

Outra grande vantagem é a capacidade de executar um pacote que não estava instalado previamente.

Vamos testar isso executando:

$ npx cowsay wow	
npx-cowsay-wow-npm-vs-npx

Isso é ótimo porque, algumas vezes, você apenas quer usar algumas ferramentas de CLI, mas não quer instalá-las globalmente somente para fins de teste.

Isso quer dizer que você pode economizar alguns espaço em disco e simplesmente executá-las somente quando precisar delas. Isso também significa que suas variáveis globais ficarão menos poluídas.

Executar código diretamente com o GitHub

execute-gist-scripts-with-npx

Isso é muito radical.

Você pode usar o npx para executar a partir de gists e repositórios do GitHub. Vamos nos concentrar na execução a partir de um gist do GitHub, já que é mais fácil de criar um.

O script mais básico consiste no arquivo principal em JS e em um arquivo package.json. Depois de configurar os arquivos, tudo o que você precisa fazer é executar o npx com o link para aquele gist, conforme mostramos na imagem acima.

Aqui você pode encontrar o código que eu usei para este exemplo.

Certifique-se de que você leu cuidadosamente todos os scripts antes de executá-los para evitar sérios problemas que possam ocorrer devido a código malicioso.

Testar versões de pacotes diferentes

O npx torna muito fácil testar versões diferentes de um pacote ou de um módulo do Node.js. Para testar esse ótimo recurso, vamos instalar localmente o pacote create-react-app e testar uma versão futura.

Isso listará algumas dist tags próximas do final do resultado. As dist tags fornecem aliases para números de versão, o que os torna muito mais fáceis de digitar.

$ npm v create-react-app
create-react-app-dist-tags

Vamos usar o npx para experimentar a dist tag next de create-react-app, o que criará a aplicação dentro de um diretório de sandbox.

$ npx create-react-app@next sandbox

O npx instalará temporariamente a próxima versão do create-react-app e, então, ela será executada para iniciar o arquivo e instalar suas dependências.

Uma vez instalado, podemos navegar até a aplicação, assim:

$ cd sandbox

e depois iniciá-la com este comando:

$ npm start
create-react-app-npx-next-version

A aplicação do React app abrirá automaticamente na janela do seu navegador padrão.
Agora, temos uma aplicação que é executada na próxima versão do pacote create-react-app!

react-app
Essa é a aparência que deve ter a página inicial do seu app do React.

Conclusão

O npx nos ajuda a evitar questões de versionamento e dependências, bem como a evitar a instalação de pacotes desnecessários que você queira apenas experimentar.

Ele também fornece um modo claro e fácil de executar pacotes, comandos, módulos e até mesmo gists e repositórios do GitHub.

Se você não usou o npx antes, agora é uma boa hora para começar!

Este artigo foi publicado originalmente no blog do autor.
Entre em contato e pergunte a ele o que quiser pelo Twitter ou pelo Facebook.