Inicio rápido: Creación de la primera aplicación Node.js con Visual Studio

Instalación de Visual Studio y de la carga de trabajo de Node.js

Si aún no tiene instalado Visual Studio:

1. Vaya a la página Descargas de Visual Studio para instalar Visual Studio 2022 de forma gratuita.

2. En el Instalador de Visual Studio, seleccione la carga de trabajo Desarrollo de Node.js y elija Instalar.

   

Si ya tiene instalado Visual Studio.

1. En Visual Studio, vaya a Herramientas > Get Tools and Features (Obtener herramientas y características).

2. En el Instalador de Visual Studio, elija la carga de trabajo Desarrollo de Node.js y seleccione Modificar para descargarla e instalarla.

Configuración del entorno de Node.js

Instale la versión LTS del entorno de ejecución de Node.js. La versión LTS tiene la mejor compatibilidad con otros marcos y bibliotecas.

Aunque Node.js se ha creado para arquitecturas de 32 y 64 bits, el instalador de Node.js solo admite una versión a la vez.

Visual Studio detecta normalmente el entorno de ejecución instalado, pero si no es así, puede configurar el proyecto para que haga referencia a él:

1. Después de crear el proyecto, haga clic con el botón derecho en el nodo del proyecto.

2. Seleccione Propiedades y establezca la ruta de acceso de Node.exe. Puede usar una instalación global de Node.js, o bien especificar la ruta de acceso a un intérprete local en cualquier proyecto de Node.js.

Instalar Visual Studio

Si todavía no ha instalado Visual Studio 2019, vaya a la página Descargas de Visual Studio para instalarlo de forma gratuita.

Instalar Visual Studio

Si todavía no ha instalado Visual Studio 2017, vaya a la página Descargas de Visual Studio para instalarlo de forma gratuita.

Configuración del entorno de Node.js

Visual Studio puede ayudar a configurar el entorno, incluida la instalación de herramientas comunes con el desarrollo de Node.js.

1. En Visual Studio, vaya a Herramientas > Get Tools and Features (Obtener herramientas y características).

2. En la Instalador de Visual Studio, elija la carga de trabajo Desarrollo de Node.js y seleccione Modificar para descargarla e instalarla.

   

3. Instale la versión LTS del entorno de ejecución de Node.js. Se recomienda la versión LTS para obtener la mejor compatibilidad con bibliotecas y marcos externos.

   Aunque Node.js se ha creado para arquitecturas de 32 y 64 bits, el instalador de Node.js solo admite una versión instalada a la vez.

4. Si Visual Studio no detecta el entorno de ejecución instalado (normalmente lo hace), configure el proyecto para que le haga referencia:

   1. Después de crear el proyecto, haga clic con el botón derecho en el nodo del proyecto.

   2. Seleccione Propiedades y establezca la Ruta de acceso de Node.exe. Puede usar una instalación global de Node.js, o bien especificar la ruta de acceso a un intérprete local en cada uno de los proyectos de Node.js.

1. Inicie Visual Studio y, luego, presione Esc para cerrar la ventana de inicio.

2. Presione Ctrl+Q y, luego, escriba node.js en el cuadro de búsqueda.

3. Seleccione Aplicación web en blanco de Node.js.

4. En el cuadro de diálogo, seleccione Crear.

1. Presione Esc para cerrar la ventana de inicio.

2. Presione Ctrl + Q para abrir el cuadro de búsqueda y escriba Node.js.

3. Elija Aplicación web en blanco de Node.js (JavaScript) . En el cuadro de diálogo, seleccione Crear.

1. En la barra de menús superior, elija Archivo > Nuevo > Proyecto.

2. En el panel izquierdo del cuadro de diálogo Nuevo proyecto, expanda JavaScript y elija Node.js.

3. En el panel central, elija Aplicación web en blanco de Node.js y seleccione Aceptar.

Visual Studio puede ayudar a configurar el entorno, incluida la instalación de herramientas comunes con el desarrollo de Node.js.

1. En el panel de la derecha, mire el Explorador de soluciones.

   • En el nivel superior hay una solución, que, de forma predeterminada, tiene el mismo nombre que el proyecto. Una solución, representada por un archivo .sln en el disco, es un contenedor para uno o más proyectos relacionados.
   • El proyecto, con el nombre que usó al configurarlo, se resalta en negrita. En el disco, este proyecto se representa mediante un archivo .njsproj en la carpeta del proyecto.
   • En el nodo npm se muestran todos los paquetes npm instalados. Puede hacer clic con el botón derecho en el nodo npm para buscar e instalar paquetes de npm mediante un cuadro de diálogo.

   

2. Para instalar paquetes de npm o comandos de Node.js desde un símbolo del sistema, haga clic con el botón derecho en el nodo del proyecto y seleccione Abrir símbolo del sistema aquí.

   

3. Para probar la navegación al código fuente, en el archivo server.js abierto, seleccione createServer y presione F12 o haga clic con el botón derecho en createServer y elija Ir a definición en el menú contextual. Este comando le lleva a la definición de la función createServer en http.d.ts.

   

4. Vuelva a server.js, busque esta línea de código: res.end('Hello World\n');, y modifíquela:

   res.end('Hello World\n' + res.connection.

   Cuando escribe connection., IntelliSense proporciona opciones para autocompletar la entrada de código.

   

5. Elija localPort y escriba ); para completar la instrucción:

   res.end('Hello World\n' + res.connection.localPort);

1. En el panel de la derecha, mire el Explorador de soluciones.

   • En el nivel superior hay una solución, que, de forma predeterminada, tiene el mismo nombre que el proyecto. Una solución, representada por un archivo .sln en el disco, es un contenedor para uno o más proyectos relacionados.
   • El proyecto, con el nombre que usó al configurarlo, se resalta en negrita. En el disco, este proyecto se representa mediante un archivo .njsproj en la carpeta del proyecto.
   • En el nodo npm se muestran todos los paquetes npm instalados. Puede hacer clic con el botón derecho en el nodo npm para buscar e instalar paquetes de npm mediante un cuadro de diálogo.

   

2. Para instalar paquetes de npm o comandos de Node.js desde un símbolo del sistema, haga clic con el botón derecho en el nodo del proyecto y seleccione Abrir símbolo del sistema aquí en el menú contextual.

   

3. Para probar la navegación al código fuente, en el archivo server.js abierto, seleccione http.createServer y presione F12, o elija Ir a definición en el menú contextual de clic derecho. Este comando le lleva a la definición de la función createServer en http.d.ts.

   

4. Vuelva a server.js, busque esta línea de código: res.end('Hello World\n');, y modifíquela:

   res.end('Hello World\n' + res.connection.

   Al escribir connection. , IntelliSense proporciona opciones para autocompletar la entrada de código.

   

5. Elija localPort y escriba ); para completar la instrucción:

   res.end('Hello World\n' + res.connection.localPort);