是否有一种方法来执行JavaScript和显示使用Visual Studio代码的结果?
例如,一个脚本文件包含:
console.log('hello world');
我假设Node.js是需要的,但不知道如何做到这一点?
通过Visual Studio Code,我指的是来自微软的新代码编辑器 不是用Visual Studio编写的代码。
是否有一种方法来执行JavaScript和显示使用Visual Studio代码的结果?
例如,一个脚本文件包含:
console.log('hello world');
我假设Node.js是需要的,但不知道如何做到这一点?
通过Visual Studio Code,我指的是来自微软的新代码编辑器 不是用Visual Studio编写的代码。
当前回答
另一种方法是打开终端ctrl+ '执行节点。现在您有了一个活动的节点REPL。您现在可以将您的文件或选定的文本发送到终端。为了做到这一点,打开VSCode命令面板(F1或ctrl+shift+p)并执行>在活动终端运行选定的文本或>在活动终端运行活动文件。
如果在执行代码之前需要一个干净的REPL,则必须重新启动节点REPL。这是在终端中使用节点REPL ctrl+c ctrl+c退出它,并键入node开始新的。
您可能可以将命令面板命令按键绑定到您希望的任何键。
node应该安装在您的路径中
其他回答
从v1.32开始,这可能是最简单的:
{
"key": "ctrl+shift+t",
"command": "workbench.action.terminal.sendSequence",
"args": { "text": "node '${file}'\u000D" }
}
使用您自己的键绑定。
参见发布说明:sendSequence和变量。
使用vscode v1.32,您可以使用像${file}这样的变量将sequence发送到终端,这是当前文件。如果你想要一些其他的路径,在上面的键绑定中用你的路径名替换${file}。
\u000D是一个返回,因此它将立即运行。
我在${file}变量周围添加了's,以防你的文件路径中有空格, 比如c:Users\Some Directory\fileToRun
这个解决方案打算运行当前打开的文件在节点和显示输出在VSCode。
我也有同样的问题,并且发现新引入的任务对于这个特定的用例很有用。这有点麻烦,但我是这么做的:
在项目的根目录中创建一个.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命令以进行单动作调用。
换句话说,就是你的任务。Json文件现在将包含:
{
"version": "0.1.0",
"command": "node",
"isShellCommand": true,
"args": [
"--harmony"
],
"tasks": [
{
"taskName": "runFile",
"isTestCommand": true,
"suppressTaskName": true,
"showOutput": "always",
"problemMatcher": "$jshint",
"args": ["${file}"]
}
]
}
...还有你的按键。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键。
只需在谷歌上搜索“Mozilla javascript参考”。打开第一个链接(developer.mozilla),然后打开该页中的任何链接。它提供了“试试”的示例代码,你可以删除和编写和测试你自己的代码。简单。无需VS-Code:-)
另一种选择是使用Visual Studio Code中的开发人员工具控制台。只需从帮助菜单中选择“切换开发人员工具”,然后在弹出的开发人员工具中选择“控制台”选项卡。从那里你有相同的开发工具REPL,你得到在Chrome。