在Visual Studio Code中运行JavaScript

小开

这很简单，当你在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
}
]
}

小开

最佳答案

这个解决方案打算运行当前打开的文件在节点和显示输出在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菜单中，点击“Code”>“Preferences”>“Keyboard Shortcuts”。添加到你的键盘快捷键:

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

小开

为了简单地运行代码并在控制台上显示输出，您可以创建一个任务并执行它，就像@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键。

小开

有一个更简单的方法来运行JavaScript，不需要配置:

安装代码运行器扩展
在文本编辑器中打开JavaScript代码文件，然后使用快捷方式控制+Alt+N(或macOS上的⌃控制+⌥选项+N)，或按F1，然后选择/键入Run Code，代码将运行，输出将显示在输出窗口中。

此外，您还可以选择部分JavaScript代码并运行代码片段。扩展也适用于未保存的文件，所以你可以创建一个文件，将其更改为Javascript并快速编写代码(当你只需要尝试一些快速的东西)。非常方便!

这需要NodeJS，否则它将无法工作。

小开

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

或者，您可以创建一个任务。这是唯一的代码在我的tasks.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"
}
]

这将在命令面板中打开“运行”，但你仍然需要用鼠标键入或选择你想要运行的任务，在这种情况下是节点。第二个快捷键切换输出面板，它已经有一个快捷键，但这些键彼此相邻，更容易使用。

小开

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

你需要做的事情是在用户设置中设置 node . js 路径

在Windows机器中安装路径时，需要设置路径。

我的名字是\"C:\\Program Files\\nodejs\\node.exe\"

因为我的文件目录名中有一个空格

参见下面的图像。我未能运行代码起初，因为我在路径名称中犯了一个错误

希望这对你有所帮助。

当然，你的问题帮助了我，因为我来这里也是为了在我的VS代码中运行JS

小开

我很惊讶居然没有人提到这一点:

只需在VS Code中打开.js文件，切换到“调试控制台”选项卡，点击左侧导航栏中的调试按钮，然后单击运行图标(播放按钮)!

需要安装nodejs !

小开

在我看来，这是你最快的方法;

visual studio代码上的开放集成终端(View > Integrated Terminal)
类型'node filename.js'
按回车键

请注意:需要节点设置。(如果你有自制程序，只需在终端上输入“brew install node”)

注2:强烈推荐自制和节点，如果你还没有。

祝你有愉快的一天。

小开

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

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

使用您自己的键绑定。

参见发行说明:sendSequence和变量。

使用vscode v1.32，你可以使用像${file}这样的变量sendSequence到终端，这是当前文件。如果你想要一些其他的路径，在上面的键绑定中用你的路径名替换${file}。

\u000D是一个返回值，因此它将立即运行。

我在${file}变量周围添加了__abc0，以防你的文件路径中有空格，像c:Users\Some Directory\fileToRun

小开

另一种方法是打开终端ctrl +”执行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开始新的时候完成的。

你可能可以将命令面板中命令键绑定到任何你想要的键。

node应该安装在你的路径中

小开

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

如果您使用Node，那么我建议使用VSC中的标准调试器。

我通常创建一个虚拟文件，比如test.js，在那里我做外部测试。

在存放代码的文件夹中，创建名为“”的文件夹。然后创建一个名为launch。json的文件

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

当你选择“Nodemon Test File”时，你需要把你的代码放在Test .js中进行测试。

要安装nodemon以及更多关于如何在VSC中调试nodemon的信息，我建议阅读文章，它将更详细地解释关于启动的第二部分。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中的开发人员工具控制台。只需从帮助菜单中选择“切换开发人员工具”，然后在弹出的开发人员工具中选择“控制台”选项卡。从那里你有相同的开发工具REPL，你得到在Chrome。

小开

你不需要在visual studio代码中设置运行javascript、python等代码的环境，你所要做的就是安装代码运行器扩展，然后选择你想要运行的代码的一部分，然后点击右上角的运行按钮。

小开

对于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".

小开

在VS代码中遵循这些步骤。[在Windows操作系统下执行]

创建新文件
在里面写javascript代码
将文件保存为filename.js
进入调试菜单
单击“开始调试”
或简单按F5

开始调试的截图

终端js代码输出的截图

编辑:阅读本文档，了解关于JS for VSCode: https://code.visualstudio.com/docs/languages/javascript的最新配置和功能

小开

我建议你使用一个简单易用的插件，叫做Quokka，它现在非常流行，可以帮助你在运行中调试代码。 Quokka.js。使用这个插件的一个最大的好处是你可以节省很多时间去浏览网页浏览器和评估你的代码，有了这个帮助，你可以看到VS代码中发生的一切，这节省了很多时间

小开

只需安装nodemon并运行

nodemon your_file.js

在vs code终端上。

小开

如果你的节点安装在你的机器上

只要打开VSCODE中的终端并键入node yourfile.js，就是这样

小开

用npm: npm install nodemon -g安装nodemon
Init nodemon: npm init

打开包。Json，并将其更改为:

{
"name": "JavaScript",
"version": "1.0.0",
"description": "",
"main": "{filename}.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
"start": "nodemon {filename}.js"
},
"keywords": [],
"author": "",
"license": "ISC"
}

打开终端，写入命令:npm start

小开

你必须设置Node.js环境变量在VS code中运行JavaScript代码。按照这些设置并创建路径。

—打开控制面板->系统→高级系统设置->环境变量 ——找到变量PATH，并将node.js文件夹路径添加为值。通常是C:\Program Files Nodejs;。如果变量不存在，则创建它。 ——重新启动IDE或计算机

如果您想知道节点可执行文件应该在C:\Program Files\nodejs文件夹中。

如果您需要检查您的路径，您可以通过右键单击文件资源管理器中的计算机或从控制面板中的安全设置来查看它。在那里选择高级系统设置。将打开一个对话框，选中Advanced选项卡。底部是一个按钮，环境变量。

小开

使用该文件名tempCodeRunnerFile运行java文件而不保存

public class tempCodeRunnerFile{
public static void main(String[] args) {
System.out.println("aaaaaa");
}
}

小开

只需搜索“Mozilla javascript参考”;在谷歌。打开第一个链接(developer.mozilla)，然后打开该页中的任何链接。它提供了“试试”;示例代码，你可以删除，并编写和测试自己的代码。简单。无需VS-Code:-)