Como configurar e utilizar os pacotes NodeJS e NPM com o PHPStorm?

  

2
Início do tópico

como usar nodejs e npm com phpstorm

Olá, ouvi dizer que, se instalar o Node.js no meu PC, posso organizar e automatizar melhor o meu trabalho de programação e desenvolvimento web, instalando e utilizando vários pacotes NPM...

Tenho algumas perguntas:

  • Podem partilhar como é que instalam o NodeJS e o npm no PHPStorm e talvez alguns truques/hacks sobre a automatização do trabalho para que o processo de desenvolvimento seja mais fácil?
  • Tem algum pacote npm favorito que recomendaria?
  • Talvez alguns pacotes npm que você usa diariamente? Como a atualização automática do navegador?

Obrigado!

1 Resposta
1

Hi,

Em primeiro lugar, é necessário instalar node.js no seu PC (descarregar a partir de AQUI); Para verificar se está corretamente instalado, é necessário verificar a versão do node js em cmd (ou em PHPStorm's terminal) digitando:

node -v

verificar a versão do nodejs no terminal phpstorm


Depois, na pasta do projeto, utilizando o terminal do PHPStorm (ou o cmd do Windows), é necessário inicializar o npm. No tipo de terminal:

npm init -y

Na sua pasta de projeto, isto criará módulos_nó com todos os pacotes que está a instalar. Ele também criará a pasta package.json com as informações sobre as dependências. O ficheiro do Npm package.json  é uma espécie de receita/lista de compras do nosso projeto com as dependências dos pacotes npm que está a instalar.


Em seguida, para instalar um pacote npm, digite no terminal:

npm install lodash

Neste caso chicote é o nome do pacote. Aqui está outro exemplo (instalando normalize.css):

npm install normalize.css

...ou instalar alguns pacotes npm necessários separados por espaço:

npm install postcss-simple-vars postcss-nested autoprefixer --save-dev

Todos estes pacotes são provenientes de https://www.npmjs.com - pode procurar aí um pacote que lhe interesse.


Para executar o npm, deve escrever:

npm run dev

instalar pacotes npm no phpstorm

Então, porque é que o NPM é importante para o nosso projeto?

Por exemplo, se acontecer alguma coisa ao nosso PC (algum tipo de avaria), podemos recuperar sempre o nosso projeto, clonando o projeto do GitHub (aprender a utilizar o GitHub e o Git com o IDE PHPStorm) e depois de clonar o projeto - o package.json (o resumo do nosso projeto) estará dentro e depois de digitar no terminal npm install todos os pacotes npm serão instalados/recuperados novamente! Ótimo! 🙂


Aqui estão alguns pacotes npm que uso com o PHPStorm:

Utilizar definitivamente servidor webpack-devAqui está como instalar este grande pacote npm de automação. Basta digitar:

npm install webpack-dev-server --save-dev

Para o carregamento lento das imagens que estou a utilizar: tamanhos preguiçosos

Pode instalá-lo digitando:

npm install lazysizes
Partilhar: