是否有一种方法来执行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编写的代码。
当前回答
过程
*(前言)
步骤如下: 根据我的记忆,没有严格测试步骤…(可能会错过一些东西?) 以后的版本可能会有一些不同的变化 事物的自动设置(例如:环境路径)可能是不同的 在Win10
运行纯js
download & install Vscode download & install Node.js from the the offical website, eg: in G:\nodejs\node.exe open Vscode -> open your workspace folder eg: MyTestSpace -> create a new file call eg: test.js write a code console.log('-----test-----'); in test.js go to the Run and Debug panel (ctrl+shift+d) > Run drop down list at the top > Add Config (MyTestSpace) > a launch.json should be auto generated for you > at the auto-completetion popup > select Node.js: Launch Program > auto complete config fill in > rename the program to the path where your test.js locate your launch.json should look something like this:: { "version": "0.2.0", "configurations": [ { "type": "node", "request": "launch", "name": "Launch Program", "program": "${workspaceFolder}/test.js", }, ], } go back to the Run drop down list > select Launch Program (MyTestSpace) > click the Run button in your Debug Console should see the following:: G:\nodejs\node.exe .\test.js -----test----- a graph for demo naming might be different (just a ugly rough draft for demo [[(just try to post an answer wrote with little effort...)]]) (ignore unnecessary staff...)
运行js & html(简要介绍)
have a eg: main_test.html file, with a <script> tag refer to the test.js in the Run drop down list > add config > select Chrome > auto complete launch.json > change path to main_test.html eg: { "type": "chrome", "request": "launch", "name": "Open main_test.html", "file": "h:\\Book\\debug\\LXPI\\OEBPS\\lib_new2\\libNt\\crossFileHtse\\build_HighlightTypeset_ReadHtse\\main_test.html", }, select that chrome launch config > Run > html is opened up in your browser & console log printed
其他回答
在VS代码中遵循这些步骤。[在Windows操作系统下执行]
创建新文件 在里面写javascript代码 保存文件为filename.js 转到调试菜单 点击“开始调试” 或者直接按F5
启动调试截图
js代码在终端输出的截图
编辑:阅读这篇关于JS for VSCode的最新配置和特性的文档:https://code.visualstudio.com/docs/languages/javascript
为了简单地运行代码并在控制台上显示输出,您可以创建一个任务并执行它,就像@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键。
只需安装nodemon并运行
nodemon your_file.js
在vs code终端上。
在我看来,这是你最快的方法;
在visual studio代码上打开集成终端(查看>集成终端) 输入“node filename.js” 按回车键
注意:节点设置需要。(如果你有自制程序,只需在终端上输入“brew install node”)
注2:如果你还没有自制和节点,强烈推荐。
祝你有愉快的一天。
如果您的节点安装在您的机器上
只要在VSCODE中打开终端,输入node yourfile.js,就是这样