Hola, he oído que si instalo Node.js en mi PC puedo organizar y automatizar mejor mi trabajo de programación y desarrollo web instalando y utilizando varios paquetes NPM....
Tengo algunas preguntas:
- Por favor, ¿puedes compartir cómo instalas NodeJS y npm en PHPStorm y tal vez algunos trucos/hacks sobre la automatización del trabajo para que el proceso de desarrollo sea más fácil?
- ¿Tienes algún paquete npm favorito que recomendarías?
- ¿Quizás algunos paquetes npm que utilizas a diario? ¿Como la actualización automática del navegador?
Gracias.
Hola,
En primer lugar, debe instalar node.js en su PC (descargar desde AQUÍ); Para comprobar si está instalado correctamente, deberá comprobar versión de node js en cmd (o en PHPStorm) tecleando:
node -v
A continuación, en la carpeta de su proyecto, utilizando el terminal del PHPStorm (o el cmd de Windows) deberá inicializar npm. En el tipo de terminal:
npm init -y
En la carpeta del proyecto se creará node_modules con todos los paquetes que está instalando. También creará paquete.json con la información de las dependencias. Archivo de Npm paquete.json es una especie de receta/lista de la compra de nuestro proyecto con las dependencias de los paquetes npm que está instalando.
A continuación, para instalar un paquete npm escriba en el terminal:
npm install lodash
En este caso lodash es el nombre del paquete. He aquí otro ejemplo (instalación de normalize.css):
npm install normalize.css
...o instalar un par de paquetes npm necesarios separados por espacios:
npm install postcss-simple-vars postcss-nested autoprefixer --save-dev
Todos estos paquetes proceden de https://www.npmjs.com - puede buscar allí el paquete que le interese.
Para ejecutar npm debe escribir:
npm run dev
¿Por qué es importante NPM para nuestro proyecto?
Por ejemplo, si le ocurre algo a nuestro PC (algún tipo de fallo), podemos recuperarse siempre nuestro proyecto clonando el proyecto de GitHub (aprender a utilizar GitHub y Git con PHPStorm IDE) y después de clonar el proyecto - el botón paquete.json (el resipe de nuestro proyecto) estará dentro y después de teclear en el terminal npm instalar ¡todos los paquetes npm se instalarán/recuperarán de nuevo! Genial 🙂 .
Estos son algunos paquetes npm que utilizo con PHPStorm:
Definitivamente usar webpack-dev-serverAquí está cómo instalar este gran paquete npm de automatización. Sólo tienes que escribir:
npm install webpack-dev-server --save-dev
Para la carga perezosa de las imágenes que estoy utilizando: lazysizes
Puedes instalarlo escribiendo:
npm install lazysizes
