NPM a package manager for javascript

Introdução

NPM(NodeJS package manager) é, primeiramente, uma ferramenta de gerenciamento de pacotes, suas versões e dependências, assim como um repositório para projetos baseados em NodeJS. É similar a outros gerenciadores de pacotes como o apt-get, homebrew e bower.

Com a utilização do NPM, o compartilhamento de códigos que resolvem pequenos e/ou específicos problemas é simplificado. Possibilitando que desenvolvedores, independente do projeto que estejam trabalhando, possam utilizar dessas soluções de uma maneira out of the box e reutilizável.

Outro ponto que é importante lembra é que uma vez que o seu projeto está dependendo de soluções de outros desenvolvedores a verificação de updates para essas dependências, assim como o download desses updates são realizados sem dificuldades com o NPM.

Conceitos Básicos

Os conjuntos de código reutilizável, distribuídos através do NPM, são chamados de pacotes, ou às vezes módulos. Um pacote é apenas um diretório com um ou mais arquivos nele, que obrigatoriamente tem um arquivo chamado "package.json" com alguns metadados sobre este pacote. Um aplicativo típico, como um site, pode depender de dezenas ou centenas de pacotes. Esses pacotes são geralmente pequenos. A idéia geral é criar um pequeno bloco de código que resolve um problema e o resolve bem. Isso torna possível o desenvolvimento de soluções maiores e personalizadas fora do escopo dos pequenos blocos de código compartilhados.

Pode-se encontrar pacotes para ajudar no desenvolvimento de aplicativos navegando no site do NPM. No site encontra-se diferentes tipos de pacotes e muitos desses pacotes são voltados para node, uma vez que o NPM começou como gerenciador de pacotes de node, portanto encontra-se muitos módulos que podem ser usados ​ em​ server-side. Há também muitos pacotes que adicionam CLIs e módulos que auxiliam no desenvolvimento de front-end.

De uma maneira simple e resumida: o NPM funciona coletando e instalando pacotes de todos os lugares. Procurando, baixando e salvado o pacote que estamos procurando.

Instalação / Atualização

O NPM é instalado juntamente com o NodeJS, portanto para instalar o NPM basta instalar o Node.

macOS

Instalador Oficial

Faça o download do pkg na página de downloads do NodeJS e siga o passa a passo.

Homebrew

$ brew install node

Linux

Debian and Ubuntu based Linux distributions

$ curl -sL https://deb.nodesource.com/setup_7.x | sudo -E bash -

$ sudo apt-get install -y nodejs

$ sudo apt-get install -y build-essential

Para outros tipos de distribuições siga as instruções na documentação na página do NodeJS

Windows

Faça o download do binário na página de downloads do NodeJS e siga o passa a passo.

Testando a instalação

Rode npm -v. A versão deve ser superior a 2.1.8

Atualizando o NPM

O NPM vem instalado juntamente com o Node, porém o NPM é atualizado com mais frequência que o Node. Portanto para ter certeza de que se tem instalado a ultima versão do gerenciador de pacotes é necessário atualiza-lo. Uma vez que o próprio NPM é feito em JS, pode-se atualiza-lo através dele mesmo com o seguinte comando:

npm install npm@latest -g

Caso o resultado da execulção do comando acima seja um erro com código EACCES, consulte a sessão seguinte.

Utilizando o NPM

O NPM pode instalar pacotes de forma global ou local. Por padrão, todos os pacotes são instalados localmente em uma pasta chamada node_modules no diretório raiz do projeto. Esta pasta, naturalmente, tem por dono o usuário atual. Por outro lado pacotes instalados globalmente são instalados em {prefix}/lib/node_modules/ que tem como dono o administrador root e onde {prefix} é, geralmente, /usr/ ou /usr/local. Portanto para a instalação de pacotes globais há a necessidade do sudo . Uma alternativa para instalar pacotes globais sem o uso de sudo é mover o local padrão de instalação dos pacotes para um local onde o usuário local tenha direito de escrita e leitura.

Mudando o local do pacotes globais

$ npm config list

Esse comando fornece informações sobre as configurações do NPM conforme exemplo abaixo:

; cli configs
registry = "https://registry.npmjs.org/"

; builtin config undefined
# DO NOT MODIFY THIS FILE - use /etc/npmrc instead. = true
globalconfig = "/etc/npmrc"
globalignorefile = "/etc/npmignore"
prefix = "/usr/local"

; node bin location = /usr/bin/nodejs
; cwd = /home/alunos/Documentos
; HOME = /home/alunos
; 'npm config ls -l' to show all defaults.

$ npm config get prefix
/usr/local

Essa é a propriedade que queremos mudar para instalar os pacotes globais no diretório home. Para criar um novo diretório na pasta home basta execultar o seguinte comando:

$ cd && mkdir .node_modules_global
$ npm config set prefix=$HOME/.node_modules_global

O que cria um pasta na home do usuário atual e configura o NPM para instalar todos os novos pacotes globais para essa nova pasta. Para verificar que a configuração foi realizada com sucesso pode-se execultar o comando npm config list e observar a mudança na variável prefix. Que agora aponta para a pasta node_modules_global.

Podemos portanto atualizar o npm da seguinte maneira:

$ npm install npm --global
$ npm -v
1.3.10

Podemos perceber do comando acima que a versão instalada pelo npm é 4.4.1 porém ainda estamos utilizando a versão 1.3.10. Para corrigir esse erro, temos que atualizar a variável PATH do nosso sistema adicionando o seguinte comando export PATH="$HOME/.node_modules_global/bin:$PATH" ao arquivo .profile ou .bash_profile e reinicie o terminal.

Instalando Pacotes Globais

$ npm install uglify-js --global

O uso da flag --global informa ao npm para instalar o pacote de forma global. Pode-se utilizar a forma abreviada -g.

$ npm install uglify-js --global
└─┬ uglify-js@2.6.2
  ├── async@0.2.10
  ├── source-map@0.5.3
  ├── uglify-to-browserify@1.0.2
  └─┬ yargs@3.10.0
    ├── camelcase@1.2.1
    ├─┬ cliui@2.1.0
    │ ├─┬ center-align@0.1.3
    │ │ ├─┬ align-text@0.1.4
    │ │ │ ├─┬ kind-of@3.0.2
    │ │ │ │ └── is-buffer@1.1.2
    │ │ │ ├── longest@1.0.1
    │ │ │ └── repeat-string@1.5.4
    │ │ └── lazy-cache@1.0.3
    │ ├── right-align@0.1.3
    │ └── wordwrap@0.0.2
    ├─┬ decamelize@1.1.2
    │ └── escape-string-regexp@1.0.5
    └── window-size@0.1.0

Ao instalar um pacotes, como é o caso do uglify-js, pacotes adicionais serão instalado também uma vez que o pacote desejado possui dependências.

Listando dependências globais

Para listar os pacotes instados globalmente pode-se utilizar do seguinte comando:

$ npm list --global
├─┬ npm@3.7.5
│ ├── abbrev@1.0.7
│ ├── ansi-regex@2.0.0
│ ├── ansicolors@0.3.2
│ ├── ansistyles@0.1.3
....................
└─┬ uglify-js@2.6.2
  ├── async@0.2.10
  ├── source-map@0.5.3
  ├── uglify-to-browserify@1.0.2

Veja que as dependêcias dos pacotes globais também são listados. Porém caso não haja necessidade para tanto detalhe, pode-se informar a flag depth que é o numero de de camadas desejadas para a listagem

$npm list -g --depth=0
├── npm@3.7.5
└── uglify-js@2.6.2

Instalando dependências localmente

Para instalar alguma dependência de forma local, basta não utilizar da flag --global. A dependência será instalada dentro de uma pasta node_modules criada no diretório pai onde se execulta o comando.

$ mkdir ~/project && cd ~/project
$ npm install underscore
/home/sitepoint/project
└── underscore@1.8.3
$ ls
node_modules
$ ls node_modules
underscore

Listando dependências locais

Para listar as dependências locais basta execultar o seguinte comando dentro de um projeto.

$ npm list
/home/sitepoint/project
└── underscore@1.8.3

Removendo dependências locais

$ npm uninstall underscore
- underscore@1.8.3 node_modules/underscore
$ npm list
/home/sitepoint/project
└── (empty)

Instalando uma versão especifica

Para instalar uma versão específica de alguma dependência, bata adicionar @ seguido a versão desejada.

$ npm install underscore@1.8.2
/home/sitepoint/project
└── underscore@1.8.2
$ npm list
/home/sitepoint/project
└── underscore@1.8.2

Atualizando uma dependência

<soruce>$ npm update underscore underscore@1.8.3 node_modules/underscore $ npm list /home/sitepoint/project └── underscore@1.8.3</source>

Gerenciando o cache

Toda vez que um pacote é instaldo, uma copia é colocada em .npm. Assim na próxima vez que esse mesmo pacote for instaldo não se tenha a necessidade de baixa-lo novamente.

$ ls ~/.npm
_locks  minimist  mkdirp  registry.npmjs.org  underscore

Para limpar esse cache basta execultar o seguinte comando: $ npm cache clean.

Gerenciado dependências

Para gerenciar as dependências de um projeto de forma mais compartilhável e de fácil gerenciamento, usa-se um arquivo de configuração chamado package.json . Pode-se criar este arquivo com o comando npm init.

$ npm init
This utility will walk you through creating a package.json file.
Press ^C at any time to quit.
name: (project) demo
version: (1.0.0)
description: Demo of package.json
entry point: (index.js)
test command:
git repository:
keywords:
author: Sitepoint
license: (ISC)

Esse comando gera o seguinte arquivo:

{
  "name": "demo",
  "version": "1.0.0",
  "description": "Demo package.json",
  "dependencies": {
    "underscore": "^1.8.3"
  },
  "devDependencies": {},
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "Sitepoint",
  "license": "ISC"
}

$ mkdir ~/demo && cd ~/demo
$ cp ~/project/package.json ~/demo
$ npm install
$ npm list
demo@1.0.0 /home/sitepoint/demo
└── underscore@1.8.3

O código acima demonstra como podemos configurar a aplicação a partir de um arquivo de configuração do npm. Basta execultar o comando npm install. Para salvar as dependências quando instalamos para o arquivo de configuração, podemos adicionar a flag --save

$ npm install request --save $ npm list --depth=0 demo@1.0.0 /home/sitepoint/demo ├── request@2.53.0 └── underscore@1.8.3

Dessa forma o npm atualiza o arquivo package.json para salvar as dependências necessarias.

"dependencies": {
  "request": "^2.53.0",
  "underscore": "^1.8.3"
}

devDependencies

Algumas dependências são necessarias apenas para o ambiente de desenvolvimento como por exemplo um framework de teste.

npm install --save-dev qunitjs

Atualizando a propriedade devDependencies do arquivo package.json.

"devDependencies": {
    "qunitjs": "^2.2.1"
  }

A principal diferença entre devDependencies e dependencies é que quando execultamos npm install --production as dependências de desenvolvimento não serão instaladas.

Prefixos de dependêcias

Podemos observar do arquivo package.json que há o caracter ~ antes da versão desejada. ~ é o default mas existem outros. Veja a seguir o que cada um significa.

• ~version - ~1.2.3 utiliza a mais recente no padrão 1.2.x e não utiliza 1.3.0. (minor version)
• ^version - ^1.2.3 utiliza a mais recente no padrão 1.x.x e não utiliza 2.0.0 (major version)
• version Utiliza a versão exata.
• >version Deve ser maior que a versão especificada
• >=version Deve ser maior ou igual a versão especificada
• <version Deve ser menor que a versão especificada
• <=version Deve ser menor ou igual a versão especificada
• 1.2.x 1.2.0, 1.2.1, etc., mas não 1.3.0
• http://sometarballurl Url para o package
• * Qualquer versão

Conclusão

Foi coberto apenas uma primeira parte introdutória à utilização do npm. Como instalar o npm, como instalar uma dependência, como atualizar, como mudar o diretório para dependências globais para evitar a utilização de sudo. Porém existem outras funcionalidades que o npm fornece, como comando padrões para rodar a aplicação, para saber mais sobre o npm visite a página de documentação da ferramenta aqui.