vscode使用及调试方式和技巧

常用快捷键

ctrl + ~

显示隐藏终端面板

Ctrl+\ 

快速拆分文件编辑

Alt+ ↑↓

移动当前代码行的位置

Ctrl+D

选中当前匹配项

Ctrl+B

切换侧边栏

alt+ 单机左键

长按鼠标滚轮+鼠标左键下拉

添加多处光标

Ctrl+p

快捷键设置

vscode调试

2022年了,该学会用VSCode debug了 - 掘金 (juejin.cn)

 之前在html文件里写了点东西,想调试下,启动调试后发现调试的不是我当前打开页面的这个html文件(我想调试index2.html但是一点启动调试总是调试的index.html),然后搜了下资料原来是需要配置的(默认调试工作目录下的index.html),所以记录下问题

 可以自己选择配置

 下面是我的简单配置(当然还有很多用法我没去配置,别问为啥问就是一般条件下用不着,vscode支持配置task.json配置和launch.json配置进行调试html文件,我只用了配置launch.json)

{// 使用 IntelliSense 了解相关属性。// 悬停以查看现有属性的描述。// 欲了解更多信息,请访问: https://go.microsoft.com/fwlink/?linkid=830387"version": "0.2.0","configurations": [{"name": "chrome debugger1","type": "chrome","request": "launch",//  默认打开的文件--${workspaceRoot}当前打开文件夹的根目录"file": "${workspaceRoot}/index.html",//  ${workspaceFolder}表示当前工作区的根文件夹及其所有子文件夹"webRoot": "${workspaceFolder}"//  运行的本地chrome浏览器exe的路径// "runtimeExecutable": "C:/Program Files (x86)/Google/Chrome/Application/chrome.exe",//  调试时运行的url// "url": "http://localhost:5500",//  调试时运行的端口// "port": 5433},{"name": "Chrome debugger2","request": "launch","type": "chrome","url": "http://localhost:8080","webRoot": "${workspaceFolder}",//  默认打开的文件--${workspaceRoot}当前打开文件夹的根目录"file": "${workspaceRoot}/index2.html"}]
}

可使用调试快捷键或者点右上角小图标

行动解释
继续/暂停
F5
继续:恢复正常的程序/脚本执行(直到下一个断点)。
暂停:检查在当前行执行的代码并逐行调试。
跨步
F10
将下一个方法作为单个命令执行,而无需检查或遵循其组件步骤。
步入
F11
输入下一个方法以逐行执行其执行。
退出
Shift+F11
在方法或子例程中时,通过完成当前方法的剩余行(就像它是单个命令一样)返回到先前的执行上下文。
重新启动
Ctrl+Shift+F5
终止当前程序执行,然后使用当前运行配置重新开始调试。
停止
Shift+F5

日志断点调试

日志断点是普通断点一种变体,  区别:不会中断调试 ,可把信息记录到控制台

使用条件:对于无法暂停或停止服务是有用。

可使用${}打印变量   比如在此处添加日志断点,b的值为${b}

F5运行查看调试结果,  使用 ctrl+ ~ 可唤出终端

条件断点调试

表达式结果为true时才会进行断点

右键添加条件调试断点:

F5进行调试,终端调试控制台查看

 

dev tools调试

一般情况下,我是使用面板调试的,记录下各种调试技巧网页

15个你不得不知道的Chorme dev tools的小技巧 - 前端开发者学堂 (fedev.cn) - 前端开发社区

如何更专业的使用Chrome开发者工具 - 前端开发者学堂 (fedev.cn) - 前端开发社区

Chrome开发者工具调试小技巧_chrome开发者控制台中几个常用的小技巧 csdn-CSDN博客

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/pingmian/47822.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

无人驾驶概览(1)

主要部分包括:高精度地图HD MAPS,定位Localization, 感知perception,预测 perdicition 规划 plan 控制 control 高精度地图HD MAPS中,几乎支持软件栈所有其他模块,包括定位感知预测和规划 定位Localizati…

Redis常用的5大数据类型

Reids字符串&#xff08;String&#xff09; 设置相同的key&#xff0c;之前内容会覆盖掉 Redis列表&#xff08;List&#xff09; 常用命令 从左往右放值 数据结构 Redis集合&#xff08;set&#xff09; sadd<key><value1><value2>...... 数据结构 Set数据…

Servlet运行过程

Servlet运行过程 Servlet程序是由WEB服务器调用&#xff0c;web服务器收到客户端的Servlet访问请求后&#xff1a; ①Web服务器首先检查是否已经装载并创建了该Servlet的实例对象。如果是&#xff0c;则直接执行第④步&#xff0c;否则执行第②步。 ②装载并创建该Servlet的…

超声波清洗机哪款好用?保姆级教学,教你手把手挑选适合自己的超声波清洗机

提及超声波清洗机&#xff0c;大家都不陌生&#xff0c;尤其是佩戴眼镜的小伙伴&#xff0c;眼镜的镜片长时间不清洁容易模糊不清&#xff0c;而超声波清洗机的出现&#xff0c;可以轻松清洗还不会损坏镜片&#xff0c;备受眼镜党喜爱。但由于现在市面上的超声波清洗机的款式太…

pyqt/pyside QTableWidget失去焦点后,选中的行仍高亮的显示

正常情况下pyqt/pyside的QTableWidget&#xff0c;点击input或者按钮失去焦点后 行的颜色消失了 如何在失去焦点时保持行的选中颜色&#xff0c;增加下面的代码&#xff1a; # 获取当前表格部件的调色板 p tableWidget.palette()# 获取活跃状态下的高亮颜色和高亮文本颜色&a…

排序系列 之 插入排序

&#xff01;&#xff01;&#xff01;排序仅针对于数组哦本次排序是按照升序来的哦 介绍 插入排序英文名为InsertSort 基本思路 1、认为数组当中的第一个数值已经排好序了2、定义一个游标从第二个数值开始不断地向后进行遍历3、游标指向的数据插入已经排好序的数组中 代码…

Windows server漏洞解决

Windows server漏洞解决 一、SSL/TLS问题1、问题2、建议3、方法1)、winR运行&#xff1a;regedit&#xff0c;进入注册表。2&#xff09;、找到注册表3&#xff09;、在Ciphers新建五个项4&#xff09;、在每个新建文件加入值 二、Apache Tomcat问题1、问题2、下载 好家伙&…

国内从事双臂机器人的团队

一、背景 随着人形机器人的发展&#xff0c;双臂协同操作得到了越来越多研究人员的关注。我自己也是做双臂机器人方向的&#xff0c;虽然通过看论文或刷知乎了解到国内有许多团队在做双臂机器人方向&#xff0c;但还没有系统的整理过&#xff0c;因此趁这次机会&#xff0c;好…

C#数字医学影像系统(RIS/PACS)源码,Oracle数据库,C/S架构,运行稳定

数字医学影像系统&#xff08;RIS/PACS&#xff09;源码&#xff0c;三甲以下的医院都能满足。PACS 系统全套成品源码。 开发技术&#xff1a;C/S架构&#xff0c;C#开发语言&#xff0c;数据库服务器采用Oracle数据库。 医学影像存储与传输系统&#xff0c;融合了医学信息化…

算法-经典递归解决排列组合

文章目录 前言1. 获取字符串的所有字串2. 数组的子集(无重复)3. 数组的子集(有重复)4. 字符大小写全排列5. 全排列(无重复)6. 全排列(有重复) 前言 如何正确的处理递归 所有的递归都分为带路径的递归和不带路径的递归, 我们之前学二叉树的时候基本上都是带路径的递归, 所有的递…

HBuilder x 使用Git管理项目,配合easy-git插件管理项目代码配置git和推送/拉取使用教程

文章目录 目录 文章目录 使用流程 小结 概要安装流程技术细节小结 概要 克隆/拉取项目代码到本地电脑教程 HBuilder x 使用Git管理项目&#xff0c;配合easy-git插件 克隆项目代码到本地教程-CSDN博客 电脑环境已安装好Hbuilder x工具 如果没有安装可以参考以下先安装好Hbui…

银发经济发展需要什么支持

随着社会老龄化的加剧&#xff0c;“银发经济”应运而生&#xff0c;成为社会发展的新动向。银发经济指的是针对老年人群体的经济活动&#xff0c;包括健康护理、休闲旅游、教育文化等多方面内容。这一现象不仅体现了社会对老年群体的关注和尊重&#xff0c;同时也为经济发展提…

HarmonyOS NEXT零基础入门到实战-第一部分

构建节页面思路&#xff1a; 1、排版 (分析布局) 2、内容&#xff08;基础组件&#xff09; 3、美化&#xff08;属性方法&#xff09; 设计资源-svg图标 界面中展示图标 ->可以使用svg图标&#xff08;任意放大缩小不失真&#xff0c;可以改颜色&#xff09; 使用方式&a…

重磅活动推荐:2024 CLK 大会启动中,承办单位开放报名

中国 Linux 内核开发者大会&#xff08;简称“CLK 大会”&#xff09;是中国 Linux 内核领域最具影响力的峰会之一&#xff0c;由清华大学、英特尔、富士通南大、IBM、阿里云、华为、腾讯等企业支持主办。大会秉承“自由、协作、创新”理念&#xff0c;以推动和普及开源技术为使…

java中Hashcode的作用【详解版】

一 HashCode作用 1.1 HashCode作用 hashCode是object类的一个方法&#xff0c;用于哈希表结构&#xff0c;主要是用来获取哈希值&#xff0c;用于确定对象在哈希表中的位置&#xff0c;如果两个对象的hashcode相同&#xff0c;那么他们可能被放在哈希表同一个位置(这取决于哈…

【每天值得看】文章获得《每天值得看》人工智能板块推荐第三名!为自己点个赞!!!

[2024-07-19]&#xff5c;CSDN每天值得看&#xff5c;人工智能 ① 【机器学习】Grid Search: 一种系统性的超参数优化方法&#xff08;鑫宝Code:[博客] [成就]&#xff09; [质量分&#xff1a;97&#xff1b;难度等级&#xff1a;未知&#xff1b;新鲜技术&#xff1a;99] 摘…

辅助类BigDecima/BigInteger

** 大数据的运算** 编号1方法解释1add2subtract-3multiply*4divide/

如何发一篇顶会论文? 涉及3D高斯,slam,自动驾驶,三维点云等等

SLAM&3DGS 1&#xff09;SLAM/3DGS/三维点云/医疗图像/扩散模型/结构光/Transformer/CNN/Mamba/位姿估计 顶会论文指导 2&#xff09;基于环境信息的定位&#xff0c;重建与场景理解 3&#xff09;轻量级高保真Gaussian Splatting 4&#xff09;基于大模型与GS的 6D pose e…

AutoMQ 生态集成 Redpanda Console

通过 Kafka Web UI 更加便利地管理 Kafka/AutoMQ 集群 随着大数据技术的飞速发展&#xff0c;Kafka 作为一种高吞吐量、低延迟的分布式消息系统&#xff0c;已经成为企业实时数据处理的核心组件。然而&#xff0c;Kafka 集群的管理和监控却并非易事。传统的命令行工具和脚本虽…

C++从入门到起飞之——this指针 全方位剖析!

个人主页&#xff1a;秋风起&#xff0c;再归来~ C从入门到起飞 个人格言&#xff1a;悟已往之不谏&#xff0c;知来者犹可追 克心守己&#xff0c;律己则安&#xff01; 目录 1、this指针 2、C和C语⾔实现Stack对⽐ C实现Stack代码 C实现Stack代…