node.js - microsoft - Ejecute JavaScript en Visual Studio Code

visual studio installer

Question

¿Hay alguna manera de ejecutar JavaScript y mostrar los resultados con Visual Studio Code?

Por ejemplo, un archivo de script que contiene

console.log(''hello world'');

Supongo que se necesitarían nodejs, pero no puedo encontrar la manera de hacerlo.

EDITAR: Por "Código de Visual Studio" me refiero al nuevo editor de Código de Microsoft - No código escrito usando Visual Studio

Visual Studio Code

Answer 1

Bueno, para ejecutar simplemente el código y mostrar el resultado en la consola, puede crear una tarea y ejecutarla, más o menos como @canerbalci menciona.

La desventaja de esto es que solo obtendrá la salida y eso es todo.

Lo que realmente me gusta hacer es poder depurar el código, digamos que estoy tratando de resolver un pequeño algoritmo o probar una nueva función ES6, y lo ejecuto y hay algo sospechoso, puedo depurarlo dentro de VSC.

Entonces, en lugar de crear una tarea para ello, modifiqué el archivo .vscode / launch.json en este directorio de la siguiente manera:

{
"version": "0.2.0",
"configurations": [
    {
        "name": "Launch",
        "type": "node",
        "request": "launch",
        "program": "${file}",
        "stopOnEntry": true,
        "args": [],
        "cwd": "${fileDirname}",
        "runtimeExecutable": null,
        "runtimeArgs": [
            "--nolazy"
        ],
        "env": {
            "NODE_ENV": "development"
        },
        "externalConsole": false,
        "sourceMaps": false,
        "outDir": null
    }
]
}

Lo que esto hace es que lanzará cualquier archivo en el que se encuentre actualmente, dentro del depurador de VSC. Está configurado para detenerse en el inicio.

Para iniciarlo, presione la tecla F5, en el archivo que desea depurar.

Answer 2

El acceso directo para el terminal integrado es (ctrl + `), luego escriba node <filename> .

Alternativamente, puede crear una tarea. Este es el único código en mis task.json:

{
// See https://go.microsoft.com/fwlink/?LinkId=733558
// for the documentation about the tasks.json format
"version": "0.1.0",
"command": "node",
"isShellCommand": true,
"args": ["${file}"],
"showOutput": "always"
}

Desde aquí crea un atajo. Este es mi keybindings.json:

// Place your key bindings in this file to overwrite the defaults
[
{   "key": "cmd+r",
"command": "workbench.action.tasks.runTask"
},
{   "key": "cmd+e",
"command": "workbench.action.output.toggleOutput"
}
]

Esto abrirá ''ejecutar'' en Command Pallete, pero aún debe escribir o seleccionar con el mouse la tarea que desea ejecutar, en este caso el nodo. El segundo acceso directo alterna el panel de salida, ya hay un acceso directo para él, pero estas teclas están una al lado de la otra y son más fáciles de trabajar.

Answer 3

Es muy simple, cuando crea un nuevo archivo en VS Code y lo ejecuta, si ya no tiene un archivo de configuración, crea uno para usted, lo único que necesita configurar es el valor del "programa" y configurarlo a la ruta de su archivo JS principal, se ve así:

{
    "version": "0.1.0",
    // List of configurations. Add new configurations or edit existing ones.  
    // ONLY "node" and "mono" are supported, change "type" to switch.
    // ABSOLUTE paths are required for no folder workspaces.
    "configurations": [
        {
            // Name of configuration; appears in the launch configuration drop down menu.
            "name": "Launch",
            // Type of configuration. Possible values: "node", "mono".
            "type": "node",
            // ABSOLUTE path to the program.
            "program": "C://test.js", //HERE YOU PLACE THE MAIN JS FILE
            // Automatically stop program after launch.
            "stopOnEntry": false,
            // Command line arguments passed to the program.
            "args": [],
            // ABSOLUTE path to the working directory of the program being debugged. Default is the directory of the program.
            "cwd": "",
            // ABSOLUTE path to the runtime executable to be used. Default is the runtime executable on the PATH.
            "runtimeExecutable": null,
            // Optional arguments passed to the runtime executable.
            "runtimeArgs": [],
            // Environment variables passed to the program.
            "env": { },
            // Use JavaScript source maps (if they exist).
            "sourceMaps": false,
            // If JavaScript source maps are enabled, the generated code is expected in this directory.
            "outDir": null
        }, 
        {
            "name": "Attach",
            "type": "node",
            // TCP/IP address. Default is "localhost".
            "address": "localhost",
            // Port to attach to.
            "port": 5858,
            "sourceMaps": false
        }
    ]
}

Answer 4

Esta es la forma más rápida para ti en mi opinión;

• Abrir terminal integrado en código visual studio ( View > Integrated Terminal )
• escriba ''node filename.js''
• presione enter

nota : se requiere la configuración del nodo. (si tiene un homebrew simplemente escriba ''brew install node'' en la terminal)

nota 2 : homebrew y nodo muy recomendable si aún no lo ha hecho.

que tengas un buen día.

Answer 5

Esto puede ser ahora el más fácil, a partir de v1.32:

{
    "key": "ctrl+shift+t",
    "command": "workbench.action.terminal.sendSequence",
    "args": { "text": "node ''${file}''/u000D" }
  }

Use su propia combinación de teclas.

Consulte las Notas de la versión: sendSequence y variables .

Con vscode v1.32 puede sendSequence al terminal utilizando variables como ${file} , que es el archivo actual. Si desea alguna otra ruta allí, reemplace $ {file} con su nombre de ruta en la combinación de teclas anterior.

El /u000D es un retorno, por lo que se ejecutará de inmediato.

Agregué '' s alrededor de la variable ${file} en caso de que la ruta del archivo tenga espacios, como c:Users/Some Directory/fileToRun

Answer 6

Hay muchas formas de ejecutar javascript en Visual Studio Code.

Si usa Node, le recomiendo usar el depurador estándar en VSC.

Normalmente creo un archivo ficticio, como test.js, donde hago pruebas externas.

En su carpeta donde tiene su código, crea una carpeta llamada ".vscode" y crea un archivo llamado "launch.json"

En este archivo, pega lo siguiente y guarda. Ahora tiene dos opciones para probar su código.

Cuando elige "Nodemon Test File" necesita poner su código a prueba en test.js.

Para instalar nodemon y obtener más información sobre cómo depurar con nodemon en VSC, recomiendo leer este article , que explica con más detalle la segunda parte del archivo launch.json y cómo depurar en ExpressJS.

{
    "version": "0.2.0",
    "configurations": [
        {
            "type": "node",
            "request": "launch",
            "name": "Nodemon Test File",
            "runtimeExecutable": "nodemon",
            "program": "${workspaceFolder}/test.js",
            "restart": true,
            "console": "integratedTerminal",
            "internalConsoleOptions": "neverOpen"
        },
        {
            "type": "node",
            "request": "attach",
            "name": "Node: Nodemon",
            "processId": "${command:PickProcess}",
            "restart": true,
            "protocol": "inspector",
        },
    ]
}

Answer 7

Hay una manera mucho más fácil de ejecutar JavaScript, no se necesita configuración:

1. Instale la extensión Code Runner
2. Abra el archivo de código JavaScript en el Editor de texto, luego use el acceso directo Control + Alt + N (o ⌃ Control + ⌥ Opción + N en macOS), o presione F1 y luego seleccione / escriba Run Code , el código se ejecutará y la salida será se muestra en la ventana de salida.

Además, puede seleccionar parte del código JavaScript y ejecutar el fragmento de código. La extensión también funciona con archivos no guardados, por lo que puede crear un archivo, cambiarlo a Javascript y escribir código rápidamente (para cuando solo necesite probar algo rápido). ¡Muy conveniente!

Answer 8

Me enfrenté a este problema exacto, cuando comencé a usar VS Code con Code Runner extensión

Lo que debe hacer es establecer la ruta node.js en Configuración de usuario

Debe configurar la ruta a medida que la instala en su máquina Windows.

Para el mío fue /"C://Program Files//nodejs//node.exe/"

Como tengo un espacio en mi nombre de directorio de archivos

Ver esta imagen a continuación. No pude ejecutar el código la primera vez porque cometí un error en el nombre de ruta

Espero que esto te ayudará.

Y, por supuesto, su pregunta me ayudó, ya que también vine para obtener ayuda para ejecutar JS en mi CÓDIGO VS

Answer 9

Me sorprende que esto no se haya mencionado aún:

Simplemente abra el archivo .js en cuestión en VS Code, cambie a la pestaña ''Consola de depuración'', presione el botón de depuración en la barra de navegación izquierda y haga clic en el icono de ejecución (botón de reproducción).

¡Requiere que se instale nodejs!

Answer 10

No es necesario establecer el entorno para ejecutar el código en javascript, python, etc. en el código de Visual Studio, lo que debe hacer es instalar la extensión Code Runner y luego seleccionar la parte del código que desea ejecutar y presionar el botón botón ejecutar presente en la esquina superior derecha.

Answer 11

Otra forma sería abrir el terminal ctrl + ` ejecutar node . Ahora tiene un nodo REPL activo. Ahora puede enviar su archivo o texto seleccionado al terminal. Para hacerlo, abra la paleta de comandos VSCode ( F1 o ctrl + shift + p ) y ejecute >run selected text in active terminal o >run active file in active terminal .

Si necesita un REPL limpio antes de ejecutar su código, deberá reiniciar el nodo REPL. Esto se hace cuando en la Terminal con el nodo REPL ctrl+c ctrl+c para salir y escribir node para comenzar de nuevo.

Probablemente podría vincular los comandos de la paleta de comandos a la tecla que desee.

PD: el node debe estar instalado y en su ruta

Answer 12

Otra opción es usar la consola de herramientas de desarrollador dentro de Visual Studio Code. Simplemente seleccione "Toggle Developer Tools" en el menú de ayuda y luego seleccione la pestaña "Console" en las herramientas de desarrollador que aparecen. Desde allí, tienes las mismas herramientas de desarrollo REPL que obtienes en Chrome.

Answer 13

Usé Node Exec, no se necesita configuración, crea el archivo que está finalizando actualmente o lo que haya sido seleccionado y sale dentro de VSCode.

https://marketplace.visualstudio.com/items?itemName=miramac.vscode-exec-node

Con un poco de configuración, puede agregar a Babel para hacer algo sobre la marcha transpilándose también.

Answer 14

Esta solución tiene la intención de ejecutar el archivo abierto actualmente en el nodo y mostrar la salida en VSCode.

Tenía la misma pregunta y encontré que las tasks recién introducidas tasks útiles para este caso de uso específico. Es un poco complicado, pero esto es lo que hice:

Cree un directorio .vscode en la raíz de su proyecto y cree un archivo tasks.json en él. Agregue esta definición de tarea al archivo:

{
    "version": "0.1.0",
    "command": "node",
    "isShellCommand": true,
    "args": [
        "--harmony"
    ],

    "tasks": [
        {
            "taskName": "runFile",
            "suppressTaskName": true,
            "showOutput": "always",
            "problemMatcher": "$jshint",
            "args": ["${file}"]
        }
    ]
}

Luego puede: press F1 > type `run task` > enter > select `runFile` > enter para ejecutar su tarea, pero me resultó más fácil agregar un enlace de teclas personalizado para abrir listas de tareas.

Para agregar el enlace de teclas, en el menú de la interfaz de usuario de VSCode, vaya a ''Código''> ''Preferencias''> ''Atajos de teclado''. Agregue esto a los atajos de teclado:

{
    "key": "cmd+r",
    "command": "workbench.action.tasks.runTask"
}

Por supuesto, puede seleccionar lo que quiera como combinación de teclas.

ACTUALIZAR:

Suponiendo que está ejecutando el código JavaScript para probarlo , puede marcar su tarea como una tarea de prueba estableciendo su propiedad isTestCommand en true y luego puede vincular una clave al comando workbench.action.tasks.test para una invocación de acción única .

En otras palabras, su archivo tasks.json ahora contendría:

{
    "version": "0.1.0",
    "command": "node",
    "isShellCommand": true,
    "args": [
        "--harmony"
    ],

    "tasks": [
        {
            "taskName": "runFile",
            "isTestCommand": true,
            "suppressTaskName": true,
            "showOutput": "always",
            "problemMatcher": "$jshint",
            "args": ["${file}"]
        }
    ]
}

... y su archivo keybindings.json ahora contendría:

{
    "key": "cmd+r",
    "command": "workbench.action.tasks.test"
}