在Visual Studio Code中运行JavaScript

有没有一种方法可以执行JavaScript并使用Visual Studio Code显示结果？

例如，一个脚本文件包含：

console.log('hello world');

我认为将需要Node.js，但无法解决该怎么做？

通过Visual Studio代码我的意思是，从微软新的代码编辑器-使用Visual Studio编写的代码没有。

该解决方案旨在在节点中运行当前打开的文件，并以VSCode显示输出。

我有同样的问题，发现新引入的tasks方法对此特定用例有用。这有点麻烦，但这是我所做的：

.vscode在项目的根目录中创建一个目录，并tasks.json在其中创建一个文件。将此任务定义添加到文件中：

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

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

然后，您可以： press F1 > type `run task` > enter > select `runFile` > enter 运行任务，但是我发现为打开任务列表添加自定义键绑定更加容易。

要添加键绑定，请在VSCode UI菜单中转到“代码”>“首选项”>“键盘快捷键”。将此添加到键盘快捷键：

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

当然，您可以选择任何您想要的键组合。

更新：

假设你正在运行的JavaScript代码来测试它，你可以标记你的任务作为检验其设置的任务isTestCommand属性来true，然后你可以绑定一个关键workbench.action.tasks.test命令用于单动作调用。

换句话说，您的tasks.json文件现在将包含：

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

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

...您的keybindings.json文件现在将包含：

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

有一种运行JavaScript的简便得多的方法，无需进行配置：

1. 安装Code Runner扩展
2. 在文本编辑器中打开JavaScript代码文件，然后使用快捷方式Control+ Alt+ N（或在macOS上为⌃ Control+ ⌥ Option+ N），或按F1，然后选择/键入Run Code，代码将运行，输出将显示在“输出”窗口中。

此外，您可以选择部分JavaScript代码并运行代码段。该扩展名还可以与未保存的文件一起使用，因此您只需创建一个文件，将其更改为Javascript并快速编写代码即可（对于只需要快速尝试的情况）。很方便！

我很惊讶，这还没有被提及：

只需.js在VS Code中打开有问题的文件，切换到“调试控制台”标签，点击左侧导航栏中的调试按钮，然后点击运行图标（播放按钮）即可！

需要安装nodejs！

我认为这是最快的方法。

• 在Visual Studio代码上打开集成终端（View > Integrated Terminal）
• 类型 'node filename.js'
• 按Enter

注意：需要设置节点。（如果您有自制软件，只需在终端上键入“ brew install node”）

注2：强烈建议您使用自制软件和节点。

祝你今天愉快。

集成终端的快捷方式是ctrl+ `，然后键入node <filename>。

或者，您可以创建一个任务。这是我的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"
}

从这里创建一个快捷方式。这是我的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"
}
]

这将在“命令面板”中打开“运行”，但是您仍然必须用鼠标键入或选择要运行的任务，在本例中为节点。第二个快捷键用于切换输出面板，已经有一个快捷键，但是这些键彼此相邻并且更易于使用。

好吧，只需运行代码并在控制台上显示输出，就可以创建任务并执行它，就像@canerbalci提到的那样。

这样做的缺点是您只会得到输出而已。

我真正想做的是能够调试代码，比如说我正在尝试解决一个小的算法或尝试一个新的ES6功能，然后运行它，但有些麻烦，我可以在VSC中对其进行调试。

因此，我没有为其创建任务，而是按如下所示修改了此目录中的.vscode / launch.json文件：

{
"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
    }
]
}

这是因为它将在VSC调试器中启动您当前正在使用的任何文件。它设置为在启动时停止。

要启动它，请在要调试的文件中按F5键。

当我第一次开始使用带有扩展名的VS Code时，我遇到了这个确切的问题Code Runner

您需要做的是在“ 用户设置”中设置node.js路径

您需要设置路径在Windows计算机中安装，。

对于我来说 \"C:\\Program Files\\nodejs\\node.exe\"

由于我的文件目录名称中有空格

请参阅下面的这张图片。我最初无法运行代码，因为我在路径名中输入了错误

希望这会帮助你。

当然，您的问题对我有帮助，因为我也来这里获得帮助，可以JS在我的VS CODE中运行

在VS代码中执行以下步骤。[在Windows操作系统中执行]

1. 建立新档案

2. 在其中编写JavaScript代码

3. 将文件另存为filename.js

4. 转到调试菜单

5. 点击开始调试

6. 或直接按F5

开始调试的屏幕截图

终端中js代码输出的屏幕截图

我使用了Node Exec，不需要任何配置，即可构建您当前正在结束的文件或已选择的文件，并在VSCode中进行输出。

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

只需进行一些配置，您就可以添加Babel来进行即时转译。

这很简单，当您在VS Code中创建一个新文件并运行它时，如果您还没有配置文件，它将为您创建一个配置文件，您唯一需要设置的就是“ program”值，并进行设置到主JS文件的路径，如下所示：

{
    "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
        }
    ]
}

无需设置在Visual Studio代码中的javascript，python等上运行代码的环境，只需安装Code Runner Extension，然后选择要运行的代码部分并点击右上角显示运行按钮。

从v1.32开始，这可能是最简单的：

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

使用您自己的键盘绑定。

请参阅发行说明：sendSequence和变量。

借助vscode v1.32，您可以sendSequence使用以下变量访问终端${file}当前文件之。如果您需要其他路径，请在上面的绑定中用您的路径名替换$ {file}。

该\u000D是回归所以它会立即运行。

我'在${file}变量周围添加了s ，以防文件路径中包含空格，例如c:Users\Some Directory\fileToRun

我建议您使用一个名为Quokka的简单插件，该插件在当今非常流行，可以帮助您随时随地调试代码。 Quokka.js。使用此插件的最大好处是，您可以节省大量时间在Web浏览器上评估代码，借助此插件，您可以看到VS代码中发生的所有事情，从而节省了很多时间。

有很多方法可以在Visual Studio Code中运行javascript。

如果使用Node，则建议使用VSC中的标准调试器。

我通常创建一个虚拟文件，例如test.js，在其中进行外部测试。

在具有代码的文件夹中，创建一个名为“ .vscode”的文件夹，并创建一个名为“ launch.json”的文件

在此文件中，粘贴以下内容并保存。现在，您有两个选择来测试代码。

当选择“ Nodemon测试文件”时，需要将代码放入test.js中进行测试。

要安装nodemon以及有关如何在VSC中使用nodemon进行调试的更多信息，我建议阅读此文章，该文章将更详细地介绍launch.json文件的第二部分以及如何在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",
        },
    ]
}

另一个选择是使用Visual Studio Code中的开发人员工具控制台。只需从帮助菜单中选择“切换开发者工具”，然后在弹出的开发者工具中选择“控制台”选项卡。从那里，您将获得与Chrome中相同的开发工具REPL。

对于Windows：只需将文件的文件关联更改.js为node.exe

1) Take VSCode
2) Right click on the file in left pane
3) Click "Reveal in explorer" from context menu
4) Right click on the file -> Select "Open with" -> Select "Choose another program"
5) Check box "Always use this app to open .js file"
6) Click "More apps" -> "Look for another app in PC"
7) Navigate to node.js installation directory.(Default C:\Program Files\nodejs\node.exe"
8) Click "Open" and you can just see cmd flashing
9) Restart vscode and open the file -> Terminal Menu -> "Run active file".

另一种方法是打开终端ctrl +` execute node。现在，您有一个激活的节点REPL。现在，您可以将文件或选定的文本发送到终端。为此，请打开VSCode 命令面板（F1或ctrl + shift + p）并执行>run selected text in active terminal或>run active file in active terminal。

如果在执行代码之前需要干净的REPL，则必须重新启动节点REPL。当在终端中使用节点REPL ctrl+c ctrl+c退出并键入node以开始新操作时，将完成此操作。

您可以将命令Palette命令绑定到所需的任何键。

PS：node应该已安装并在您的路径中

只需安装nodemon并运行

nodemon your_file.js

在vs代码终端上。