vscode 调试 C++/JavaScript
Microsoft Visual Studio Code:https://blog.csdn.net/freeking101/article/details/86715578
IntelliJ IDEA:https://www.jetbrains.com/products/
在调试 JavaScript 代码时, 其中 三种 比较 简单:
- 1.使用 Chrome 等 浏览器 调试
- 2. 使用 Ctrl+Shift+B 快捷键运行 html 文件,需要在 Tasks.json 配置
- 2.在 vscode 配置 JavaScript 运行环境
1. 使用 Chrome 等 浏览器 调试
Debugger for Chrome:https://marketplace.visualstudio.com/items?itemName=msjsdiag.debugger-for-chrome
Microsoft Visual Studio Code 中文手册:https://www.cntofu.com/book/98/README.md
vs code debug:https://code.visualstudio.com/docs/editor/debugging#_launch-configurations
VSCode 内置 Node.js 运行时,能调试 javascript,TypeScript。如果要 启动调试, 需要设置启动配置文件 launch.json。
单击调试视图顶部的配置齿轮图标
选择调试环境,vscode将在 .vscode 目录下生成一个 launch.json 的配置文件
launch.json 中有很多属性可以设置,通过 智能提示 可以 查看有那些属性可以设置。
如果 要查看属性的具体含义,可以把鼠标悬停在属性上面,会属性的使用说明。
在 launch.json 文件中的配置如下:
{"version": "0.2.0","configurations": [{"name": "谷歌浏览器", //运行html文件,用谷歌浏览器打开"type": "chrome","request": "launch","url": "${file}","sourceMaps": true,"webRoot": "${workspaceRoot}"},{"name": "nodeLauch", //单独调试js,即可以直接运行js"type": "node","request": "launch","program": "${file}", //这个配置成你要调试的文件、${file}当前打开的文件"stopOnEntry": false,"args": [],"cwd": "${workspaceRoot}","runtimeExecutable": null,"runtimeArgs": ["--nolazy"],"env": {"NODE_ENV": "development"},"console": "internalConsole","preLaunchTask": "","sourceMaps": false,"outDir": null}]
}
在 launch.json 中会使用到一些 预定变量,这些变量的具体含义如下
${workspaceRoot} the path of the folder opened in VS Code(VSCode中打开文件夹的路径)
${workspaceRootFolderName} the name of the folder opened in VS Code without any solidus (/)(VSCode中打开文件夹的路径, 但不包含"/")
${file} the current opened file(当前打开的文件)
${relativeFile} the current opened file relative to workspaceRoot(当前打开的文件,相对于workspaceRoot)
${fileBasename} the current opened file's basename(当前打开文件的文件名, 不含扩展名)
${fileDirname} the current opened file's dirname(当前打开文件的目录名)
${fileExtname} the current opened file's extension(当前打开文件的扩展名)
${cwd} the task runner's current working directory on startup()
2. 使用 Ctrl+Shift+B 快捷键 运行html文件
Ctrl+Shift+B 快捷键运行 html 文件,在 Tasks.json 中配置如下:
{"version": "0.1.0","command": "","isShellCommand": false,"args": ["${file}"],"showOutput": "always","windows": {"command": "C:/Users/shannonliang/AppData/Local/Google/Chrome/Application/chrome.exe"},"tasks": [{"taskName": "webserver","isBuildCommand": true,"showOutput": "always"}]
}
不想每次都按这个快捷键,请参考 npm 配置 node 服务方法:
How to view my HTML code in browser with Visual Studio Code?
https://stackoverflow.com/questions/30039512/how-to-view-my-html-code-in-browser-with-visual-studio-code
3. 在vscode配置JavaScript运行环境
1. 下载并安装 Node.js( Node.js 是 JavaScript 的一个运行环境 )
这个在 Node.js 官网或者中文网都可以找到
2. 配置vscode
点击 vscode中 “调试” 按钮,打开 launch.json 文件(或者使用 Ctrl+Shift+P 输入launch.json)
在里面添加
"version": "0.2.0","configurations": [{"name": "Launch","type": "node","request": "launch","program": "${workspaceRoot}/1.js","stopOnEntry": false,"args": [],"cwd": "${workspaceRoot}","runtimeExecutable": null,"runtimeArgs": ["--nolazy"],"env": { "NODE_ENV": "development" },"externalConsole": false,"preLaunchTask": "","sourceMaps": false,"outDir": null},{"name": "Attach","type": "node","request": "attach","port": 5858}]
注意:${workspaceRoot} 为当前程序工作的绝对路径。
3.调试
新建一个js文件,将launch.json中program里面的1.js改为你要调试的文件名,并把改文件放在绝对路径下
(function name(params) {console.log("message");
})();
使用 F5调试,得到
node --debug-brk=37692 --nolazy Untitled-1.js
Debugger listening on [::]:37692
message
调试成功
3. vscode C++开发环境配置教程(教你如何用vscode写C++)
From:https://www.cnblogs.com/baihualiaoluan/p/10661669.html
MinGW、MinGW-w64 与TDM-GCC 应该如何选择?:https://www.zhihu.com/question/39952667
tdm-gcc:https://jmeubank.github.io/tdm-gcc/download/
VSCode 连接远程 linux 服务器进行 C++ 开发:https://www.cnblogs.com/sinicheveen/p/14203670.html
使用 VSCode 的 Remote-SSH 连接 Linux 进行远程开发:https://www.jb51.net/article/193264.htm
C/C++ for Visual Studio Code:https://code.visualstudio.com/docs/languages/cpp
打开vscode
点击左侧栏第五个,在搜索框中输入"chinese",安装第一个插件(汉化),
然后输入"c++",也安装第一个插件,然后重启,继续进行下一步操作。
下载编译环境
在这里用的是 TDM-GCC,下载完成后按照默认安装即可,但要记住TDM-GCC的安装路径,在接下来要用到。
配置环境变量
在TDM-GCC安装完成后,我们需要将它的路径加入到系统的环境变量里
操作如下:我的电脑 --->右键 属性 ---> 高级系统设置 ---> 环境变量 ---> 系统环境变量
在 系统变量 中点击 path,然后点击编辑,将上面的路径加入即可。格式形如:C:\TDM-GCC-64\bin;
配置vscode里的环境
在 vscode 中,文件 ---> 打开文件夹 ---> 选择文件夹 ---> 选中,这样就直接加入到 vscode 中了。或者直接把一个文件拖入vscode中。接着,在这个文件下创建一个 .vscode 文件夹(注意名字一定是.vscode),这是必须的(一般来说,每个文件夹中都会有这么一个 .vscode 配置文件)。注意:将此文件夹放在常用文件夹顶层,就不需要重复配置了。
在 .vscode 文件夹 中,新建两个(只需两个)配置文件,即 launch.json、tasks.json。将下列内容复制进去即可:
tasks.json
{"version": "2.0.0","tasks": [{"label": "g++","command": "g++","args": ["-g","${file}","-o","${fileDirname}/${fileBasenameNoExtension}.exe"],"problemMatcher": {"owner": "cpp","fileLocation": ["relative","${workspaceRoot}"],"pattern": {"regexp": "^(.*):(\\d+):(\\d+):\\s+(warning|error):\\s+(.*)$","file": 1,"line": 2,"column": 3,"severity": 4,"message": 5}},"group": {"kind": "build","isDefault": true}}]
}
launch.json:
一定要注意:miDebuggerPath 这一条,要与你TDM-GCC安装路径一致,注意在路径中 '\'要替换为'\\',就像下面一样。
{"version": "0.2.0","configurations": [{"name": "(gdb) Launch", // 配置名称,将会在启动配置的下拉菜单中显示"type": "cppdbg", // 配置类型,这里只能为cppdbg"request": "launch", // 请求配置类型,可以为launch(启动)或attach(附加)"program": "${fileDirname}/${fileBasenameNoExtension}.exe",// 将要进行调试的程序的路径"args": [], // 程序调试时传递给程序的命令行参数,一般设为空即可"stopAtEntry": false, // 设为true时程序将暂停在程序入口处,一般设置为false"cwd": "${workspaceRoot}",// 调试程序时的工作目录,一般为${workspaceRoot}即代码所在目录"environment": [],"externalConsole": true,// 调试时是否显示控制台窗口,一般设置为true显示控制台"MIMode": "gdb","miDebuggerPath": "C:\\TDM-GCC-64\\bin\\gdb64.exe",// miDebugger的路径,注意这里要与MinGw的路径对应"preLaunchTask": "g++", // 调试会话开始前执行的任务,一般为编译程序,c++为g++, c为gcc"setupCommands": [{"description": "Enable pretty-printing for gdb","text": "-enable-pretty-printing","ignoreFailures": true}]}]
}
编写第一个C++程序
在配置完成后,建立一个 test.cpp 文件,粘贴以下代码
#include <iostream>
using namespace std;
int main()
{cout << "Hello Vscode" << endl;getchar();return 0;
}
打上断点,如图:
因为 vscode 在执行完程序后会退出,所以可以选择增加一个断点或者加一句 getchar(); 接下来,Ctrl+F5 运行
vscode 调试 C++/JavaScript相关推荐
- vscode 调试html页面,基于VSCode调试网页JavaScript代码过程详解
一.调试准备 Windows10 64bits IDE:Visual Studio Code1.28.2 安装插件:Chrome(安装方法:Debug -> Install Additional ...
- vscode调试html文件,vscode调试html文件
1. vscode调试html文件 主要说明使用使用Debugger for Chrome插件如何配置,以及Nodejs的方式调试. 本文的配置方式是基于deepin系统的,适用于所有debian系的 ...
- VSCode调试代码的三种方式
VSCode调试代码的三种方式 一.配置auto-attach(影响全局的终端) 在vscode的终端里运行node时,根据不同的选项,自动判断是否启动debug模式. ctrl + shift + ...
- vscode 调试debugging功能 -- 翻译学习
原文:https://code.visualstudio.com/docs/editor/debugging 调试 vscode的一个关键特性是它的强大的调试支持.vscode的内置调试可以帮助加速你 ...
- 使用 vscode 调试前端代码
使用 vscode 调试前端代码 今天我们以webpack项目为基础讲解配置 复制代码 1. 安装插件 Debugger for Chrome 2. 修改 config/index.js 将devto ...
- (004)RN开发VSCode调试ReactNative项目
1. 添加配置文件 点击小蜘蛛后,按第一步.第二步操作即可 接着选择调试平台☑️下面四个.点击OK,会生成一个launch.json文件并打开. 2. 添加断点 接下来,我们回到DEDUG,点击右边的 ...
- 使用vscode调试Nodejs
之前想用vscode调试nodejs,总是不成功,也走很多弯路,现在记录下来. 首先新建一个文件夹,用vscode打开这个文件夹, 用vscode自带的终端执行npm init,输入名称,其他的可不输 ...
- chrome调试的JavaScript官方技巧
无意中看到这个调试技巧,感觉还挺全的,底下的部分有些还看不懂,先保存下,以后学习. 链接:chrome调试的JavaScript官方技巧
- ubuntu下vscode调试开发踩过的坑
最近刚过安装了中文版的ubuntu18.04.1,安装完之后想在ubuntu上安装vscode做c/c++的开发调试,踩了不少坑,在此记录一下,希望大家在这条路上不要再踩同样的坑. 1.安装vscod ...
最新文章
- hash是线程安全的吗?怎么解决?_这次进程、线程、多线程和线程安全问题,一次性帮你全解决了...
- 仅用 4 小时,吃透“百度太行”背后硬科技!
- 启动mysqld报 mysql the server quit without updating pid file
- 探寻阿里云服务器迈入2.0时代的技术要点
- ACM入门之【ST表/RMQ】
- 在C盘和D盘执行php 结果不同,window_双系统电脑给C盘扩容后导致D盘Win10引导项丢失该怎么办?,为了写个经验,特意把C盘用无 - phpStudy...
- C+ 轮融资发布会抽奖名单公布,还有 20 万礼物正在路上
- OpenGL Multi-Indirect Draw小行星的实例
- c++调用mysql存储过程_C++中ADO调用MySQL存储过程失败,诡异的语法异常,求解中,附源码...
- Java多线程(2)--Thread类继承和Runnable接口创建线程
- linux进程退出没有log,Linux下应用进程消失原因分析-Go语言中文社区
- overlapped重叠IO
- 《Python游戏趣味编程》 第6章 见缝插针
- RH413-Linux系统下umask测试
- 数据可视化历史上的“人肉里程碑”
- Atitit ati licenseService 设计原理
- IDEA构建Spring源码
- Unity特效制作规范
- lisp画示坡线_示坡线画法图文教程
- 简单的学籍管理系统c语言,c语言学生学籍管理系统—精简版.pdf
热门文章
- Spring Cloud实战小贴士:随机端口
- 论文解读:Attention is All you need
- 论文阅读课8-Chinese Relation Extraction with Multi-Grained Information and External Linguistic Knowledge
- 多页面webpack配置
- 五大原则让你的代码不再受bug的困扰
- vim 插件之commentary
- ubuntu安装wine之后进不了系统
- 从文本分类问题中的特征词选择算法追踪如何将数学知识,数学理论迁移到实际工程中去...
- js 操作 iframe
- 王道计算机网络 应用层整理 超详细版