{"id":15845,"date":"2019-05-22T11:17:39","date_gmt":"2019-05-22T14:17:39","guid":{"rendered":"https:\/\/blog.hostinger.io\/br-tutoriais\/?p=15845"},"modified":"2025-05-02T18:27:34","modified_gmt":"2025-05-02T21:27:34","slug":"o-que-e-npm","status":"publish","type":"post","link":"\/br\/tutoriais\/o-que-e-npm","title":{"rendered":"O que \u00e9 NPM? Introdu\u00e7\u00e3o b\u00e1sica ao Node Package Manager"},"content":{"rendered":"<p>Com o npm, desenvolvedores de <strong>JavaScript<\/strong> podem encontrar e instalar pacotes de c&oacute;digo em suas aplica&ccedil;&otilde;es de rede ou projetos de servidor.<\/p><p>Um pacote <strong>node.js<\/strong> &eacute; um diret&oacute;rio com um ou mais m&oacute;dulos ou bibliotecas JavaScript, usados para adicionar v&aacute;rias funcionalidades a aplicativos ou scripts. Sem os pacotes, os desenvolvedores e engenheiros de software precisam escrever c&oacute;digo do zero para cada funcionalidade que seu projeto necessita.<\/p><p>Este artigo explicar&aacute; como o npm funciona e ensinar&aacute; como iniciar um projeto com ele, al&eacute;m de instalar pacotes adicionais.<\/p><p class=\"has-text-align-center\"><a href=\"https:\/\/assets.hostinger.com\/content\/tutorials\/pdf\/HTML-Cheat-Sheet.pdf\" target=\"_blank\" rel=\"noopener\">Baixe o Guia de Recursos HTML definitivo<\/a><\/p><p>\n\n\n\n\n\n\n<\/p><p><\/p><p>\n\n\n<div class=\"protip\">\n                    <h2 class=\"featured-snippet title\">O Que &eacute; npm?<\/h2>\n                    <p>O gerenciador de pacotes Node (npm) &eacute; um dos maiores reposit&oacute;rios de software do mundo. Ele vem acompanhado do node.js, um ambiente de servidor de c&oacute;digo aberto.<\/p>\n                <\/div>\n\n\n\n<\/p><h2 class=\"wp-block-heading\" id=\"h-como-o-npm-funciona\"><strong>Como o npm Funciona?<\/strong><\/h2><p>Aqui est&atilde;o as tr&ecirc;s fun&ccedil;&otilde;es definidoras do npm:<\/p><ul class=\"wp-block-list\">\n<li><strong>Reposit&oacute;rio <\/strong>&ndash; o npm &eacute; um <a href=\"https:\/\/npmjs.com\/\" target=\"_blank\" rel=\"noopener\"><strong>reposit&oacute;rio<\/strong><\/a> amplamente utilizado para publicar projetos Node de c&oacute;digo aberto, onde desenvolvedores podem compartilhar seu c&oacute;digo-fonte com outros usu&aacute;rios do npm. Alguns dos pacotes mais famosos que voc&ecirc; pode baixar de um reposit&oacute;rio npm incluem <strong>Angular<\/strong>, <a href=\"\/br\/tutoriais\/o-que-e-react-javascript\"><strong>React<\/strong><\/a> e <a href=\"https:\/\/www.npmjs.com\/package\/jquery\" target=\"_blank\" rel=\"noopener\"><strong>jQuery<\/strong><\/a>.<\/li>\n\n\n\n<li><strong>Interface de linha de comando (CLI)<\/strong> &ndash; desenvolvedores executam o <a href=\"\/br\/tutoriais\/o-que-e-cli\"><strong>CLI<\/strong><\/a> npm a partir de um terminal ou uma ferramenta de linha de comando para instalar ou desinstalar pacotes e gerenciar vers&otilde;es ou depend&ecirc;ncias.<\/li>\n\n\n\n<li><strong>Registro <\/strong>&ndash; qualquer pacote ou m&oacute;dulo que voc&ecirc; instala usando o CLI npm &eacute; baixado do <a href=\"https:\/\/registry.npmjs.org\/\" target=\"_blank\" rel=\"noopener\"><strong>registro p&uacute;blico npm<\/strong><\/a>, o banco de dados de softwares JavaScript.<\/li>\n<\/ul><h2 class=\"wp-block-heading\" id=\"h-o-que-e-package-json\"><strong>O Que &eacute; package.json?<\/strong><\/h2><p>Todo projeto npm cont&eacute;m um <strong>package.json<\/strong>, um arquivo localizado no diret&oacute;rio raiz. Ele cont&eacute;m os metadados de projetos ou pacotes npm, como vers&otilde;es de pacotes e colaboradores.<\/p><p>O arquivo <strong>package.json<\/strong> simplifica a identifica&ccedil;&atilde;o, gerenciamento e instala&ccedil;&atilde;o de um pacote. &Eacute; por isso que &eacute; essencial incluir um arquivo <strong>package.json<\/strong> antes de publicar projetos no registro npm.<\/p><p>Aqui est&aacute; um exemplo do que um arquivo <strong>package.json<\/strong> cont&eacute;m:<\/p><pre class=\"wp-block-preformatted\">{\n  \"name\": \"hostinger-npm\",\n  \"version\": \"1.0.0\",\n  \"description\": \"npm guide for beginner\",\n  \"main\": \"beginner-npm.js\",\n  \"scripts\": {\n    \"test\": \"echo \\\"Error: no test specified\\\" &amp;&amp; exit 1\"\n  },\n  \"dependencies\": {\n    \"express\": \"^4.17.1\"\n  },\n  \"repository\": {\n    \"type\": \"git\",\n    \"url\": \"https:\/\/github.com\/hostinger\/example.git\"\n  },\n  \"keywords\": [\n    \"npm\",\n    \"example\",\n    \"basic\"\n  ],\n  \"author\": \"Hostinger International\",\n  \"license\": \"MIT\",\n}<\/pre><p>Para te ajudar a entender o <strong>package.json<\/strong>, vamos passar pelas linhas mais importantes do exemplo anterior:<\/p><pre class=\"wp-block-preformatted\">\"name\": \"hostinger-npm\",<\/pre><p>A linha acima define o <strong>nome do pacote<\/strong>. Ela deve ter menos de 214 caracteres e consistir apenas de letras min&uacute;sculas. Se voc&ecirc; deseja publicar uma ferramenta no registro npm, seu nome n&atilde;o pode ser igual a um pacote j&aacute; existente.<\/p><pre class=\"wp-block-preformatted\">\"version\": \"1.0.0\",<\/pre><p>A linha <strong>version<\/strong> especifica a vers&atilde;o atual do seu projeto, e deve seguir as regras de <a href=\"https:\/\/docs.npmjs.com\/about-semantic-versioning\" target=\"_blank\" rel=\"noopener\"><strong>versionamento sem&acirc;ntico<\/strong><\/a>.<\/p><pre class=\"wp-block-preformatted\">\"description\": \"npm guide for beginner\",<\/pre><p>Inclua as informa&ccedil;&otilde;es do pacote na linha <strong>&nbsp;description <\/strong>para ajudar os usu&aacute;rios a descobrir seu projeto no registro npm.<\/p><pre class=\"wp-block-preformatted\">\"main\": \"beginner-npm.js\",<\/pre><p>O campo <strong>main<\/strong> especifica o ponto de entrada ou o arquivo principal do seu projeto. Se essa propriedade for deixada em branco, o npm definir&aacute; automaticamente seu valor para <strong>index.js<\/strong>.<\/p><pre class=\"wp-block-preformatted\">\"scripts\": {\n    \"test\": \"echo \\\"Error: no test specified\\\" &amp;&amp; exit 1\"\n},<\/pre><p>A propriedade <strong>scripts <\/strong>cont&eacute;m comandos que executam tarefas para o seu projeto. Um usu&aacute;rio npm pode aproveitar este campo para passar argumentos para o CLI sem precisar digit&aacute;-los novamente.<\/p><pre class=\"wp-block-preformatted\">\"dependencies\": {\n  \"express\": \"^4.16.4\"\n},<\/pre><p>Este campo lista todas as <strong>depend&ecirc;ncias <\/strong>ou pacotes usados no projeto. Quando voc&ecirc; instala uma ferramenta usando o comando <code>npm install<\/code>, aquele projeto ser&aacute; automaticamente inserido aqui.<\/p><pre class=\"wp-block-preformatted\">\"repository\": {\n  \"type\": \"git\",\n  \"url\": \"https:\/\/github.com\/hostinger\/example.git\"\n},<\/pre><p>A propriedade <strong>repository <\/strong>cont&eacute;m a URL do c&oacute;digo fonte. Neste exemplo, <a href=\"\/br\/tutoriais\/o-que-github\"><strong>GitHub<\/strong><\/a> &eacute; o local do pacote, e <a href=\"\/br\/tutoriais\/tutorial-do-git-basics-introducao\"><strong>Git<\/strong><\/a> &eacute; o sistema de controle de vers&atilde;o.<\/p><pre class=\"wp-block-preformatted\">\"keywords\": [\n  \"npm\",\n  \"example\",\n  \"basic\"\n],<\/pre><p>Este campo inclui uma s&eacute;rie de <strong>palavras-chave <\/strong>relacionadas ao que o pacote faz, ajudando os usu&aacute;rios do npm a localizar pacotes por meio de pesquisas. Voc&ecirc; pode omitir essa propriedade se voc&ecirc; n&atilde;o vai publicar o projeto no registro npm.<\/p><pre class=\"wp-block-preformatted\">\"author\": \"Hostinger International\",<\/pre><p>Use a propriedade <strong>author <\/strong>&nbsp;para declarar o criador do projeto.<\/p><pre class=\"wp-block-preformatted\">\"license\": \"MIT\",<\/pre><p>Esta linha define a <strong>licen&ccedil;a <\/strong>do projeto npm, informando &agrave;s pessoas se podem us&aacute;-lo sem quaisquer restri&ccedil;&otilde;es.<\/p><p>Para informa&ccedil;&otilde;es sobre os outros campos do <strong>package.json<\/strong>, consulte a <a href=\"https:\/\/docs.npmjs.com\/files\/package.json\" target=\"_blank\" rel=\"noopener\"><strong>sua documenta&ccedil;&atilde;o oficial<\/strong><\/a>.<\/p><h2 class=\"wp-block-heading\" id=\"h-o-que-sao-dependencias-e-devdependencies\"><strong>O que s&atilde;o Depend&ecirc;ncias e devDependencies?<\/strong><\/h2><p>Dependencies e devDependencies s&atilde;o campos no <strong>package.json<\/strong> que listam todos os pacotes dos quais um projeto depende.<\/p><p>O campo de depend&ecirc;ncia inclui todos os pacotes de terceiros que s&atilde;o necess&aacute;rios para o funcionamento do seu projeto.<\/p><p>Por outro lado, a propriedade devDependency cont&eacute;m pacotes que s&atilde;o necess&aacute;rios apenas durante o desenvolvimento.<\/p><p>As depend&ecirc;ncias e devDependencies s&atilde;o instaladas atrav&eacute;s do comando<code> npm install<\/code> com as flags <code>--save<\/code> e <code>--save-dev<\/code>.<\/p><h2 class=\"wp-block-heading\" id=\"h-como-instalar-modulos-npm-e-iniciar-projetos\"><strong>Como Instalar M&oacute;dulos npm e Iniciar Projetos?<\/strong><\/h2><p>Antes de usar o npm, certifique-se de que o <a href=\"\/br\/tutoriais\/o-que-e-node-js\"><strong>node.js<\/strong><\/a> est&aacute; instalado. Para fazer isso, abra seu terminal e execute este comando:<\/p><pre class=\"wp-block-preformatted\">node -v<\/pre><p>A janela do terminal deve exibir a vers&atilde;o do <strong>node.js<\/strong> instalada no seu sistema:<\/p><pre class=\"wp-block-preformatted\">V14.17.5&nbsp;<\/pre><p>Fa&ccedil;a o mesmo para o npm usando o seguinte comando:<\/p><pre class=\"wp-block-preformatted\">npm -v<\/pre><p>Ele tamb&eacute;m deve retornar um n&uacute;mero de vers&atilde;o como este:<\/p><pre class=\"wp-block-preformatted\">6.14.14<\/pre><p>Se o <strong>node.js<\/strong> ainda n&atilde;o foi instalado, fa&ccedil;a o download dele no <a href=\"https:\/\/nodejs.org\/en\/download\/\" target=\"_blank\" rel=\"noopener\"><strong>site oficial<\/strong><\/a>.<\/p><div class=\"wp-block-image\">\n<figure class=\"aligncenter size-full\"><img decoding=\"async\" width=\"1022\" height=\"469\" src=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2024\/03\/node-js-download.png\/public\" alt=\"site oficial do node.js com links de download\" class=\"wp-image-42841\" srcset=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2024\/03\/node-js-download.png\/w=1022,fit=scale-down 1022w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2024\/03\/node-js-download.png\/w=300,fit=scale-down 300w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2024\/03\/node-js-download.png\/w=150,fit=scale-down 150w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2024\/03\/node-js-download.png\/w=768,fit=scale-down 768w\" sizes=\"(max-width: 1022px) 100vw, 1022px\" \/><\/figure><\/div><p>Nas pr&oacute;ximas se&ccedil;&otilde;es, vamos passar por alguns dos comandos b&aacute;sicos do npm.<\/p><p>\n\n\n<div class=\"protip\">\n                    <h4 class=\"title\">Dica<\/h4>\n                    <p>Se voc&ecirc; est&aacute; usando o VPS da Hostinger, pode escolher um <a href=\"https:\/\/support.hostinger.com\/pt\/articles\/1583571-quais-sao-os-sistemas-operacionais-disponiveis-para-vps\" target=\"_blank\" rel=\"noopener\"><strong>template de sistema operacional<\/strong><\/a> com o Node.js j&aacute; pr&eacute;-instalado. Para saber mais sobre essa op&ccedil;&atilde;o, visite a p&aacute;gina <a href=\"\/br\/vps\/hospedagem-nodejs\"><strong>VPS Node.js<\/strong><\/a> da Hostinger.<\/p>\n                <\/div>\n\n\n\n<\/p><h3 class=\"wp-block-heading\" id=\"h-iniciando-um-projeto-com-npm\"><strong>Iniciando um Projeto com npm<\/strong><\/h3><p>Para iniciar um novo projeto, execute o seguinte comando a partir do CLI do npm:<\/p><pre class=\"wp-block-preformatted\">npm init<\/pre><p>Este comando criar&aacute; um arquivo <strong>package.json<\/strong> do projeto no diret&oacute;rio atual.<\/p><p>Ap&oacute;s executar o comando <code>npm init<\/code>, o terminal exibir&aacute; estas informa&ccedil;&otilde;es:<\/p><pre class=\"wp-block-preformatted\">This utility will walk you through creating a package.json file.\nIt only covers the most common items, and tries to guess sensible defaults.\n\nSee `npm help init` for definitive documentation on these fields\nand exactly what they do.\n\nUse `npm install &lt;pkg&gt;` afterwards to install a package and\nsave it as a dependency in the package.json file.\n\nPress ^C at any time to quit.\npackage name: (test-npm)<\/pre><p>A linha de comando te solicitar&aacute; a inserir as informa&ccedil;&otilde;es do projeto na seguinte ordem:<\/p><ul class=\"wp-block-list\">\n<li>Nome do pacote<\/li>\n\n\n\n<li>Vers&atilde;o inicial<\/li>\n\n\n\n<li>Descri&ccedil;&atilde;o<\/li>\n\n\n\n<li>Ponto de entrada<\/li>\n\n\n\n<li>Comando de teste<\/li>\n\n\n\n<li>Reposit&oacute;rio Git<\/li>\n\n\n\n<li>Palavras-chave<\/li>\n\n\n\n<li>Autor<\/li>\n\n\n\n<li>Licen&ccedil;a<\/li>\n<\/ul><p>Responda a cada um dos prompts do <code>npm init<\/code> digitando os valores desejados e pressionando pressionar <strong>Enter<\/strong>. Alternativamente, pressione <strong>Enter<\/strong> sem digitar nada para manter os valores padr&atilde;o ou os que est&atilde;o entre par&ecirc;nteses.<\/p><p>Aqui est&aacute; um exemplo de como preenchemos as informa&ccedil;&otilde;es do pacote:<\/p><pre class=\"wp-block-preformatted\">name: (test-npm)hostinger-npm\nversion: (1.0.0)1.0.0\ndescription: npm guide for beginner\nentry point: (index.js) beginner-npm.js\ntest command:\ngit repository:\nkeywords: npm, example, beginner\nauthor: Hostinger International\nlicense: (ISC) MIT<\/pre><p>Ap&oacute;s inserir todos os detalhes do projeto, o <code>npm init<\/code> exibir&aacute; a pr&eacute;-visualiza&ccedil;&atilde;o do arquivo <strong>package.json<\/strong>, assim:<\/p><pre class=\"wp-block-preformatted\">{\n  \"name\": \"hostinger-npm\",\n  \"version\": \"1.0.0\",\n  \"description\": \"npm guide for beginner\",\n  \"main\": \"beginner-npm.js\",\n  \"scripts\": {\n    \"test\": \"echo \\\"Error: no test specified\\\" &amp;&amp; exit 1\"\n  },\n  \"keywords\": [\n    \"npm\",\n    \"example\",\n    \"beginner\"\n  ],\n  \"author\": \"Hostinger International\",\n  \"license\": \"MIT\", \n}\n\nIs this OK? (yes)<\/pre><p>Digite <strong>sim<\/strong> e pressione <strong>Enter<\/strong> para salvar o arquivo <strong>package.json <\/strong>. Voc&ecirc; pode modific&aacute;-lo mais tarde editando o arquivo ou executando novamente o comando <code>npm init<\/code>.<\/p><p>Se voc&ecirc; deseja gerar o arquivo <strong>package.json<\/strong> com valores padr&atilde;o sem responder aos prompts do npm init, use este comando:<\/p><pre class=\"wp-block-preformatted\">npm init --yes<\/pre><p>o npm criar&aacute; um arquivo <strong>package.json <\/strong>com os valores padr&atilde;o, assim:<\/p><pre class=\"wp-block-preformatted\">{\n  \"name\": \"mymac-MacBok-Pro\",\n  \"version\": \"1.0.0\",\n  \"description\": \"\",\n  \"main\": \"index.js\",\n  \"scripts\": {\n    \"test\": \"echo \\\"Error: no test specified\\\" &amp;&amp; exit 1\"\n  },\n  \"keywords\": [],\n  \"author\": \"\",\n  \"license\": \"ISC\"\n}<\/pre><p>Uma vez que voc&ecirc; tenha criado o arquivo <strong>package.json<\/strong>, voc&ecirc; pode adicionar quaisquer pacotes node ao projeto.<\/p><h3 class=\"wp-block-heading\" id=\"h-instalando-modulos-npm-no-seu-projeto\"><strong>Instalando M&oacute;dulos npm no Seu Projeto<\/strong><\/h3><p>&Eacute; essencial aprender como instalar um pacote ao come&ccedil;ar com o npm.<\/p><p>Para adicionar um pacote ao seu projeto, execute um desses comandos:<\/p><pre class=\"wp-block-preformatted\">npm install &lt;package-name&gt;\n\/\/ OR\nnpm i &lt;package-name&gt;<\/pre><p>\n\n\n<div class=\"protip\">\n                    <h4 class=\"title\">Dica<\/h4>\n                    <p>Nos comandos acima, substitua \"nome-do-pacote\" pelo nome do m&oacute;dulo que voc&ecirc; deseja instalar.<\/p>\n                <\/div>\n\n\n\n<\/p><p>Por exemplo, se voc&ecirc; deseja instalar o <a href=\"https:\/\/www.npmjs.com\/package\/express\" target=\"_blank\" rel=\"noopener\"><strong>express<\/strong><\/a>, um framework web muito popular que simplifica os processos padr&atilde;o de desenvolvimento web, use o seguinte comando:<\/p><pre class=\"wp-block-preformatted\">npm install express<\/pre><p>Este comando instalar&aacute; o m&oacute;dulo express na pasta <strong>node_modules<\/strong> no diret&oacute;rio raiz do projeto. Note que <strong>node_modules<\/strong> s&oacute; aparecer&aacute; ap&oacute;s a instala&ccedil;&atilde;o do primeiro pacote.<\/p><p>Se o pacote for instalado com sucesso, o terminal exibir&aacute; uma mensagem como esta:<\/p><div class=\"wp-block-image\">\n<figure class=\"aligncenter size-full\"><img decoding=\"async\" width=\"868\" height=\"111\" src=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2024\/03\/pacote-instalado.png\/public\" alt=\"instalando m&oacute;dulos npm\" class=\"wp-image-42842\" srcset=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2024\/03\/pacote-instalado.png\/w=868,fit=scale-down 868w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2024\/03\/pacote-instalado.png\/w=300,fit=scale-down 300w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2024\/03\/pacote-instalado.png\/w=150,fit=scale-down 150w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2024\/03\/pacote-instalado.png\/w=768,fit=scale-down 768w\" sizes=\"(max-width: 868px) 100vw, 868px\" \/><\/figure><\/div><p>O <strong>package.json <\/strong>tamb&eacute;m incluir&aacute; o m&oacute;dulo no campo <code>dependencies<\/code>:<\/p><pre class=\"wp-block-preformatted\">{\n  \"name\": \"hostinger-npm\",\n  \"version\": \"1.0.0\",\n  \"description\": \"npm guide for beginner\",\n  \"main\": \"beginner-npm.js\",\n  \"scripts\": {\n    \"test\": \"echo \\\"Error: no test specified\\\" &amp;&amp; exit 1\"\n  },\n  \"keywords\": [\n    \"npm\",\n    \"example\",\n    \"basic\"\n  ],\n  \"author\": \"Hostinger International\",\n  \"license\": \"MIT\",\n  \"dependencies\": {\n    \"express\": \"^4.17.1\"\n  }\n}<\/pre><h3 class=\"wp-block-heading\" id=\"h-instalando-um-pacote-como-dependencia-de-desenvolvimento\"><strong>Instalando um Pacote Como Depend&ecirc;ncia de Desenvolvimento<\/strong><\/h3><p>Para instalar quaisquer ferramentas que ser&atilde;o usadas apenas no ambiente de desenvolvimento, use o seguinte comando:<\/p><pre class=\"wp-block-preformatted\">npm install &lt;nome-do-pacote&gt; --save-dev<\/pre><p>Por exemplo, voc&ecirc; pode querer usar o <a href=\"https:\/\/www.npmjs.com\/package\/nodemon\" target=\"_blank\" rel=\"noopener\"><strong>nodemon<\/strong><\/a> para recarregar seu projeto quando qualquer arquivo for alterado. Para instalar essa ferramenta, digite isso no terminal:<\/p><pre class=\"wp-block-preformatted\">npm install nodemon --save-dev<\/pre><p>Uma vez que o nodemon esteja instalado, o terminal mostrar&aacute; esta mensagem:<\/p><div class=\"wp-block-image\">\n<figure class=\"aligncenter size-full\"><img decoding=\"async\" width=\"856\" height=\"196\" src=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2024\/03\/nodemon.png\/public\" alt=\"instala&ccedil;&atilde;o do nodemon como depend&ecirc;ncia no npm\" class=\"wp-image-42843\" srcset=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2024\/03\/nodemon.png\/w=856,fit=scale-down 856w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2024\/03\/nodemon.png\/w=300,fit=scale-down 300w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2024\/03\/nodemon.png\/w=150,fit=scale-down 150w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2024\/03\/nodemon.png\/w=768,fit=scale-down 768w\" sizes=\"(max-width: 856px) 100vw, 856px\" \/><\/figure><\/div><p>O npm tamb&eacute;m adicionar&aacute; a se&ccedil;&atilde;o <code>devDependencies<\/code> com os novos dados ao arquivo <strong>package.json<\/strong>, assim:<\/p><pre class=\"wp-block-preformatted\">{\n  \"name\": \"hostinger-npm\",\n  \"version\": \"1.0.0\",\n  \"description\": \"npm guide for beginner\",\n  \"main\": \"beginner-npm.js\",\n  \"scripts\": {\n    \"test\": \"echo \\\"Error: no test specified\\\" &amp;&amp; exit 1\"\n  },\n  \"keywords\": [\n    \"npm\",\n    \"example\",\n    \"basic\"\n  ],\n  \"author\": \"Hostinger International\",\n  \"license\": \"MIT\",\n  \"dependencies\": {\n    \"express\": \"^4.17.1\"\n  }\n  \"devDependencies\": {\n    \"nodemon\": \"^2.0.12\"\n  }\n}<\/pre><p><strong>Instalando um M&oacute;dulo Globalmente em Seu Sistema<\/strong><\/p><p>Caso queira instalar um pacote npm para ser usado a partir da linha de comando, insira um dos seguintes comandos:<\/p><pre class=\"wp-block-preformatted\">npm install &lt;package-name&gt; --global\n\/\/ OR\nnpm i &lt;package-name&gt; -g<\/pre><p>Certifique-se de substituir <code>&lt;nome-do-pacote&gt;<\/code> pelo nome do m&oacute;dulo.<\/p><h3 class=\"wp-block-heading\" id=\"h-atualizando-o-npm\"><strong>Atualizando o npm<\/strong><\/h3><p>Para manter seu c&oacute;digo e ferramentas seguros e est&aacute;veis, atualize regularmente os pacotes locais e globais baixados do registro npm.<\/p><p>Antes de atualizar qualquer pacote npm, verifique se algum deles est&aacute; desatualizado. Voc&ecirc; pode verificar quais pacotes npm no seu projeto ou sistema t&ecirc;m atualiza&ccedil;&otilde;es dispon&iacute;veis executando este comando a partir do diret&oacute;rio raiz:<\/p><pre class=\"wp-block-preformatted\">npm outdated<\/pre><p>Para verificar pacotes globais desatualizados no sistema, execute o seguinte comando:<\/p><pre class=\"wp-block-preformatted\">npm outdated -g --depth=0<\/pre><p>Ap&oacute;s obter a lista de m&oacute;dulos desatualizados, voc&ecirc; pode atualizar todos os pacotes ou apenas um deles.<\/p><p>Para atualizar todos os pacotes do seu projeto, execute isso a partir da linha de comando:<\/p><pre class=\"wp-block-preformatted\">npm update<\/pre><p>Para atualizar um &uacute;nico m&oacute;dulo, insira isto:<\/p><pre class=\"wp-block-preformatted\">npm update &lt;nome-do-pacote&gt;<\/pre><p>Lembre-se de substituir <code>&lt;nome-do-pacote&gt;<\/code> pelo nome do pacote que voc&ecirc; deseja atualizar.<\/p><p>Para atualizar todos os pacotes globais no sistema, execute o comando abaixo:<\/p><pre class=\"wp-block-preformatted\">npm update -g<\/pre><p>Se voc&ecirc; quiser atualizar um &uacute;nico pacote global, insira o seguinte comando, substituindo <code>&lt;nome-do-pacote&gt;<\/code> pelo nome do m&oacute;dulo:<\/p><pre class=\"wp-block-preformatted\">npm update -g &lt;nome-do-pacote&gt;<\/pre><p>Para atualizar seu gerenciador de pacotes Node, execute este comando:<\/p><pre class=\"wp-block-preformatted\">npm install npm@latest -g<\/pre><p>Uma vez que a vers&atilde;o mais recente do npm esteja instalada, a janela do terminal exibir&aacute; uma mensagem como esta:<\/p><div class=\"wp-block-image\">\n<figure class=\"aligncenter size-full\"><img decoding=\"async\" width=\"592\" height=\"53\" src=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2024\/03\/atualizando-npm.png\/public\" alt=\"atualiza&ccedil;&atilde;o do npm via linha de comando\" class=\"wp-image-42844\" srcset=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2024\/03\/atualizando-npm.png\/w=592,fit=scale-down 592w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2024\/03\/atualizando-npm.png\/w=300,fit=scale-down 300w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2024\/03\/atualizando-npm.png\/w=150,fit=scale-down 150w\" sizes=\"(max-width: 592px) 100vw, 592px\" \/><\/figure><\/div><p>Para outros comandos CLI do npm, confira a <a href=\"https:\/\/docs.npmjs.com\/cli\/v7\/commands\" target=\"_blank\" rel=\"noopener\"><strong>documenta&ccedil;&atilde;o de comandos do npm<\/strong><\/a>.<\/p><figure class=\"wp-block-image size-large\"><a href=\"\/br\/\" target=\"_blank\" rel=\"noreferrer noopener\"><img decoding=\"async\" width=\"1024\" height=\"300\" src=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2023\/02\/BR-Web-hosting_in-text-banner.png\/public\" alt=\"\" class=\"wp-image-32927\" srcset=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2023\/02\/BR-Web-hosting_in-text-banner.png\/w=1024,fit=scale-down 1024w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2023\/02\/BR-Web-hosting_in-text-banner.png\/w=300,fit=scale-down 300w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2023\/02\/BR-Web-hosting_in-text-banner.png\/w=150,fit=scale-down 150w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2023\/02\/BR-Web-hosting_in-text-banner.png\/w=768,fit=scale-down 768w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2023\/02\/BR-Web-hosting_in-text-banner.png\/w=1536,fit=scale-down 1536w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/a><\/figure><h2 class=\"wp-block-heading\" id=\"h-conclusao\"><strong>Conclus&atilde;o<\/strong><\/h2><p>O npm &eacute; um gerenciador de pacotes popular que permite aos desenvolvedores de JavaScript compartilhar e implantar pacotes &uacute;teis de maneira r&aacute;pida e f&aacute;cil.<\/p><p>Todo projeto npm cont&eacute;m um arquivo chamado<strong> package.json <\/strong>em seu diret&oacute;rio raiz. Este arquivo inclui os metadados do projeto, que permitem que qualquer pessoa encontre o m&oacute;dulo no reposit&oacute;rio npm.<\/p><p>Al&eacute;m de conter as informa&ccedil;&otilde;es cr&iacute;ticas do projeto, o <strong>package.json<\/strong> tamb&eacute;m armazena a lista de depend&ecirc;ncias do projeto necess&aacute;rias para o funcionamento de um projeto.<\/p><p>Al&eacute;m disso, os pacotes que os desenvolvedores instalaram para auxili&aacute;-los durante o processo de desenvolvimento ser&atilde;o inclu&iacute;dos no <strong>package.json <\/strong>, em devDependencies.<\/p><p>Aqui est&aacute; uma vis&atilde;o geral dos comandos npm para te ajudar a realizar tarefas b&aacute;sicas com este gerenciador de pacotes:<\/p><ul class=\"wp-block-list\">\n<li><strong>Verificar a vers&atilde;o do npm:<\/strong><\/li>\n<\/ul><pre class=\"wp-block-preformatted\">npm -v<\/pre><ul class=\"wp-block-list\">\n<li><strong>Iniciar um projeto:<\/strong><\/li>\n<\/ul><pre class=\"wp-block-preformatted\">npm init<\/pre><ul class=\"wp-block-list\">\n<li><strong>Instalar m&oacute;dulos:<\/strong><\/li>\n<\/ul><pre class=\"wp-block-preformatted\">npm install &lt;nome-do-pacote&gt;<\/pre><ul class=\"wp-block-list\">\n<li><strong>Instalar um pacote como uma depend&ecirc;ncia de desenvolvimento:<\/strong><\/li>\n<\/ul><pre class=\"wp-block-preformatted\">npm install &lt;nome-do-pacote&gt; --save-dev<\/pre><ul class=\"wp-block-list\">\n<li><strong>Instalar um m&oacute;dulo globalmente no sistema:<\/strong><\/li>\n<\/ul><pre class=\"wp-block-preformatted\">npm install &lt;nome-do-pacote&gt; --global<\/pre><ul class=\"wp-block-list\">\n<li><strong>Atualizar todos os pacotes em um projeto:<\/strong><\/li>\n<\/ul><pre class=\"wp-block-preformatted\">npm update<\/pre><ul class=\"wp-block-list\">\n<li><strong>Atualizar para a vers&atilde;o mais recente do npm:<\/strong><\/li>\n<\/ul><pre class=\"wp-block-preformatted\">npm install npm@latest -g<\/pre><p>Esperamos que este artigo tenha ajudado voc&ecirc; a entender o que &eacute; npm e fornecido algumas dicas sobre como come&ccedil;ar a trabalhar com ele. Sinta-se &agrave; vontade para deixar um coment&aacute;rio abaixo se tiver alguma d&uacute;vida. Bons projetos!<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Com o npm, desenvolvedores de JavaScript podem encontrar e instalar pacotes de c&oacute;digo em suas aplica&ccedil;&otilde;es de rede ou projetos de servidor. Um pacote node.js &eacute; um diret&oacute;rio com um ou mais m&oacute;dulos ou bibliotecas JavaScript, usados para adicionar v&aacute;rias funcionalidades a aplicativos ou scripts. Sem os pacotes, os desenvolvedores e engenheiros de software precisam [&#8230;]<\/p>\n<p><a class=\"btn btn-secondary understrap-read-more-link\" href=\"\/br\/tutoriais\/o-que-e-npm\">Read More&#8230;<\/a><\/p>\n","protected":false},"author":92,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"rank_math_title":"","rank_math_description":"Aprender o que \u00e9 npm permite otimizar seu fluxo de trabalho com o JavaScript. Saiba como usar a ferramenta pela linha de comando!","rank_math_focus_keyword":"o que \u00e9 npm","footnotes":""},"categories":[4928],"tags":[6336,6594,6592,6591,6593],"class_list":["post-15845","post","type-post","status-publish","format-standard","hentry","category-html","tag-instalar-node-js","tag-instalar-npm","tag-javascript-npm","tag-npm","tag-o-que-e-npm"],"hreflangs":[{"locale":"en-US","link":"https:\/\/www.hostinger.com\/tutorials\/what-is-npm","default":0},{"locale":"pt-BR","link":"https:\/\/www.hostinger.com\/br\/tutoriais\/o-que-e-npm","default":0},{"locale":"fr-FR","link":"https:\/\/www.hostinger.com\/fr\/tutoriels\/quest-ce-que-npm","default":0},{"locale":"es-ES","link":"https:\/\/www.hostinger.com\/es\/tutoriales\/que-es-npm","default":0},{"locale":"id-ID","link":"https:\/\/www.hostinger.com\/id\/tutorial\/apa-itu-npm","default":0},{"locale":"en-UK","link":"https:\/\/www.hostinger.com\/uk\/tutorials\/what-is-npm","default":0},{"locale":"en-MY","link":"https:\/\/www.hostinger.com\/my\/tutorials\/what-is-npm-a-basic-introduction-for-beginners","default":0},{"locale":"en-PH","link":"https:\/\/www.hostinger.com\/ph\/tutorials\/what-is-npm-a-basic-introduction-for-beginners","default":0},{"locale":"es-MX","link":"https:\/\/www.hostinger.com\/mx\/tutoriales\/que-es-npm","default":0},{"locale":"es-CO","link":"https:\/\/www.hostinger.com\/co\/tutoriales\/que-es-npm","default":0},{"locale":"es-AR","link":"https:\/\/www.hostinger.com\/ar\/tutoriales\/que-es-npm","default":0},{"locale":"pt-PT","link":"https:\/\/www.hostinger.com\/pt\/tutoriais\/o-que-e-npm","default":0},{"locale":"en-IN","link":"https:\/\/www.hostinger.com\/in\/tutorials\/what-is-npm","default":0},{"locale":"en-CA","link":"https:\/\/www.hostinger.com\/ca\/tutorials\/what-is-npm","default":0},{"locale":"en-AU","link":"https:\/\/www.hostinger.com\/au\/tutorials\/what-is-npm","default":0},{"locale":"en-NG","link":"https:\/\/www.hostinger.com\/ng\/tutorials\/what-is-npm","default":0}],"acf":[],"_links":{"self":[{"href":"https:\/\/www.hostinger.com\/br\/tutoriais\/wp-json\/wp\/v2\/posts\/15845","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.hostinger.com\/br\/tutoriais\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.hostinger.com\/br\/tutoriais\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.hostinger.com\/br\/tutoriais\/wp-json\/wp\/v2\/users\/92"}],"replies":[{"embeddable":true,"href":"https:\/\/www.hostinger.com\/br\/tutoriais\/wp-json\/wp\/v2\/comments?post=15845"}],"version-history":[{"count":13,"href":"https:\/\/www.hostinger.com\/br\/tutoriais\/wp-json\/wp\/v2\/posts\/15845\/revisions"}],"predecessor-version":[{"id":49832,"href":"https:\/\/www.hostinger.com\/br\/tutoriais\/wp-json\/wp\/v2\/posts\/15845\/revisions\/49832"}],"wp:attachment":[{"href":"https:\/\/www.hostinger.com\/br\/tutoriais\/wp-json\/wp\/v2\/media?parent=15845"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.hostinger.com\/br\/tutoriais\/wp-json\/wp\/v2\/categories?post=15845"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.hostinger.com\/br\/tutoriais\/wp-json\/wp\/v2\/tags?post=15845"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}