Desarrollar código de JavaScript y TypeScript en Visual Studio sin proyectos ni soluciones

A partir de Visual Studio 2017, se puede desarrollar código sin proyectos ni soluciones, lo que permite abrir una carpeta de código y empezar de inmediato a trabajar con un editor enriquecido, como IntelliSense, búsqueda, refactorización, depuración, etc. Además de estas características, Herramientas de Node.js para Visual Studio permite compilar archivos de TypeScript, administrar paquetes de npm y ejecutar scripts de npm.

Para empezar, haga clic en Archivo>Abrir>Carpeta en la barra de herramientas. El Explorador de soluciones muestra todos los archivos de la carpeta; puede abrir cualquiera de ellos para comenzar a editar. En segundo plano, Visual Studio indexa los archivos para habilitar las características de npm, compilación y depuración.

Sugerencia

Antes de usar un proyecto mediante Abrir carpeta, intente crear una solución a partir del código de Node.js existente. En algunos escenarios, este método proporciona una mejor compatibilidad con las características en Visual Studio. Para crear el proyecto, elija Archivo > Nuevo proyecto > JavaScript > A partir del código existente de Node.js y, luego, elija la carpeta del proyecto como origen.

Requisitos previos

  • Visual Studio 2017, versión 15.8 o posteriores
  • Debe estar instalada la carga de trabajo Desarrollo de Node.js de Visual Studio

Integración con npm

Si la carpeta que abre contiene un archivo package.json, puede hacer clic con el botón derecho en package.json para mostrar un menú contextual (menú emergente) específico de npm.

npm menu in Solution Explorer

En el menú contextual, puede administrar los paquetes instalados por npm de la misma forma que administra paquetes de npm cuando usa un archivo de proyecto.

Además, el menú también permite ejecutar los scripts definidos en el elemento scripts de package.json. Estos scripts usan la versión de Node.js disponible en la variable de entorno PATH. Los scripts se ejecutan en una ventana nueva. Es una excelente manera de ejecutar la compilación o scripts.

Compilación y depuración

package.json

Si el archivo package.json de la carpeta especifica un elemento main, el comando Depurar estará disponible en el menú contextual de package.json. Al hacer clic en él se inicia node.exe con el script especificado como argumento.

Archivos de JavaScript

Puede depurar archivos de JavaScript si hace clic con el botón derecho en un archivo y selecciona Depurar en el menú contextual. Esto inicia node.exe con ese archivo de JavaScript como argumento.

Nota

Si no ve la opción de menú Depurar, es posible que tenga que crear el proyecto a partir de código de Node.js existente, como se ha descrito anteriormente.

Archivos de TypeScript y tsconfig.json

Si no hay ningún archivo tsconfig.json en la carpeta, haga clic con el botón derecho en un archivo de TypeScript para ver los comandos del menú contextual para compilar y depurar ese archivo. Al usar estos comandos, se compila o se depura con tsc.exe con las opciones predeterminadas. (Para depurar, es necesario compilar el archivo).

Nota

Al compilar código de TypeScript, se usa la versión más reciente instalada en C:\Program Files (x86)\Microsoft SDKs\TypeScript.

Si hay un archivo tsconfig.json en la carpeta, puede hacer clic con el botón derecho en un archivo de TypeScript para ver un comando de menú para depurar ese archivo de TypeScript. La opción solo aparece si no hay ningún elemento outFile especificado en tsconfig.json. Si hay un outFile especificado, puede depurar ese archivo si hace clic con el botón derecho en tsconfig.json y selecciona la opción correcta. El archivo tsconfig.json también ofrece una opción de compilación para que pueda especificar las opciones del compilador.

Nota

Puede encontrar más información sobre tsconfig.json en la página del manual de TypeScript sobre tsconfig.json.

Pruebas unitarias

Puede habilitar la integración de pruebas unitarias en Visual Studio al especificar una raíz de prueba en su archivo package.json:

{
    // ...
    "vsTest":{
        "testRoot": "./tests"
    }
    // ...
}

El ejecutor de pruebas enumera los paquetes instalados localmente para determinar qué marco de pruebas usar. Si no se reconoce ninguno de los marcos admitidos, el ejecutor de pruebas tiene como valor predeterminado ExportRunner. Los otros marcos admitidos son:

Después de abrir el Explorador de pruebas (elija Prueba>Windows>Explorador de pruebas), Visual Studio detecta y muestra las pruebas.

Nota

El ejecutor de pruebas solo enumerará los archivos JavaScript en la raíz de prueba; si la aplicación se ha escrito en TypeScript, tendrá que compilarlos primero.