Vscode:常用插件 & 快捷键 & 配置等

2023-11-05

一、常用插件:

1.git相关的:

(1)在代码中显示git提交日志(包含Git账号&commit信息,给Vscode添加Git功能):

        GitLens — Git supercharged

(2)显示图形化的瀑布时间线Git记录,可基于某个分支创建新分支或搜某个commit:Git Graph

使用方法参考:vscode 插件 Git Graph 使用_沉迷月色831的博客-CSDN博客_git graph

2.修改标签时,自动重命名标签:Auto Rename Tag

3.彩虹括号(高亮突出括号匹配)Bracket Pair Colorizer

4.编写便于阅读的注释(只能作用于js类文件,普通.html不能用):Better Comments

使用方式:在js的单行注释或多行注释语句前:加特殊标志符即可。

// * 表示重点
// ! 表示错误和警告
// ? 表示询问和问题
// // 表示删除
// TODO 表示代办事项

5.描述性图标(区分不同文件和文件夹):vscode-iconsMaterial Icon ThemeSimple icons.

6.在代码中显示引入或导入的估计大小:Import Cost

7.高亮缩进(每行代码之前的):indent-rainbow

8.源码阅读做标记或书签类:Todo TreeBookmark

这2种标记都可以在VScode左侧边栏查看,并点击直接跳转到源码标记处。

Todo Tree使用:在注释语句中添加大写TODO关键字即可,如:// TODO xxx文本描述 

Bookmarks使用:添加或删除书签快捷键:Ctrl + Alt + K

 9、 koroFileHeader自动添加文件头&函数注释模板语句:

文件头:Ctrl + Alt +i    函数注释:Ctrl + Alt +t

10、Svg Preview:在vscode中查看svg格式图片。

11、

二、常用快捷键:

快捷键 功能 备注
ctrl+shift+k 删除当前行

1.全局查找某个文件:ctrl + p

2.所有命令之母: ctrl + shift + p

3.查看函数或符号定义(定义需使用关键词如function声明的):

直接跳转到定义文件:F12

以预览方式查看定义文件:Alt+F12

4.前进或后退到光标所在源码的上一个光标所在位置:alt + 键盘左右方向键

5.单行注释:ctrl + /   多行注释:Alt+Shift+A 

三、快速生成HTML标签

1.带有某个类的div:div.类名

2多个标签(乘法运算符):div*10

3.

四、其他使用操作

 1.配置User Snippets常用代码片段( 用法:输入关键词-》Tab-》自动生成目标代码 )

左下角"设置" -> "用户代码片段" -> 对应编程语言的json配置文件如:javascript.json ->编写json配置即可

{
	"Print to console":{
		"prefix": "lg",  // 输入的关键词
		"body": [
			"\tconsole.log(\"这是我要打印的内容\",$0);"  // tab键点击后生成的目标代码片段; $0变量位置即光标定位的位置;双引号需转义;
		],
		"description":"Print the console" // 输入关键词后VScode给的提示语,默认不写是key
	}
}
// 变量可枚举的2种提示用法
"body" : [
    "printf(\"%${1:you can use i,s,c,f}\", $2);"  // 花括号+冒号
    "printf(\"%${1|i,s,c,f|}\", $2);"  // 花括号+2个竖杠
]
// 文件注释头
"header comment": {
		"prefix": "hc",
		"body": [
			"$BLOCK_COMMENT_START", // 注释开头特殊变量
			" * Author: lucy",
			" * Date: $CURRENT_YEAR-$CURRENT_MONTH-$CURRENT_DATE", // 当前年月日特殊变量
			"$BLOCK_COMMENT_END"
		]
}

Snippers快速生成工具:GitHub - pawelgrzybek/snippet-generator: Snippet generator for Visual Studio Code, Sublime Text and Atom


扩展链接:

Top 40+ VSCode Extensions for Developers in 2022 - Tabnine BlogOver half of developers surveyed by stackoverflow in 2019 said they used VS Code as their primary development environment. Sure, there are some who still hang onto their old favorites like Eclipse and Emacshttps://www.tabnine.com/blog/top-vscode-extensions/

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

Vscode:常用插件 & 快捷键 & 配置等 的相关文章

  • 在 Node.js 中生成带条形码的 pdf

    我在用https github com devongovett pdfkit https github com devongovett pdfkit生成 PDF 文件 我可以简单地使用类似的方法 app get get pdf req re
  • 在节点环境中存根 jQuery.ajax (jQuery 2.x)

    我正在尝试运行一些需要存根的测试jQuery ajax 我正在使用 SinonJS 来做到这一点 它曾经与旧版本的 jQuery 1 x 一起工作得很好 var require jquery var sinon require sinon
  • Javascript 将对象推送为克隆

    我将 d3 用于交互式网络应用程序 我需要绑定的数据在交互过程中发生变化 并且由 JSON 变量中的一些选定对象组成 为此 我在 JSON 变量上使用了映射 并进行了一些查询来选择适当的对象 对象被推送到列表中 并且该列表被绑定为新数据 我
  • 判断字符串是否包含有效的javascript代码

    我正在寻找一个C 返回的函数true如果字符串包含有效的 JavaScript 语法 例如 IsValidJavascript alert hello 会回来true but IsValidJavascript alertXXhelloZ
  • 将时间戳转换为一个数组

    在应用程序脚本 谷歌表中运行 我从 API 获取时间戳并返回此结果 1 6370611672429312E18 1 63706107263277082E18 我执行此代码并且工作正常 但问题不在数组中 我每次都需要它在数组中 const t
  • Angular UI 路由器嵌套视图问题

    我在理解 Angular UI Router 嵌套视图的工作原理时遇到了一些问题 我的 stateProvider 看起来像这样 stateProvider state login url login views main template
  • JavaScript 相当于 Python 的参数化 string.format() 函数

    这是 Python 示例 gt gt gt Coordinates latitude longitude format latitude 37 24N longitude 115 81W Coordinates 37 24N 115 81W
  • onClick 处理程序在每个渲染周期触发

    我有这样的默认状态 this state selectedTab tab1 then 我的渲染方法是这样的 render const selectedTab this state return li tab1 li li tab2 li d
  • 如何显示接下来的三个图像单击加载更多按钮

    我需要一个加载更多按钮来显示图像 页面加载时 我显示 3 个图像 单击 加载更多 按钮后 接下来的 3 个图像将显示在屏幕上 我尝试了下面的代码 但它不起作用 你能帮我解决这个问题吗 function item slice 0 2 show
  • Firefox Addon 中的 JQuery 导致多个警告

    我在 Firefox 插件中使用 jquery 但我不断收到大量警告消息 如下所示 anonymous function does not always return a value System JS WARNING resource g
  • AngularJS + jQuery 移动

    是否还有其他可能性来设计AngularJS以移动友好的方式应用程序CSS 我正在计划一个移动应用程序 并希望使用 AngularJS 进行逻辑和数据绑定 但我不想自己设计所有内容CSS The AngularJSFAQ说它使用jQuery
  • Angular2:动态同步http请求

    Goal 发出一系列同步 http 请求并能够将它们作为一个可观察流进行订阅 示例 不工作 let query arr test1 test2 test3 function make request query arr if query a
  • 如何从 html 页面 [javascript] 调用 Web 服务方法而不刷新页面

    我有一个webservice这将返回一个值 我的要求是 我需要调用它webservice从一个index html页面 该页面有一个 html 提交按钮 在该按钮上单击我正在呼叫JavaScript 从那里我想调用网络方法 我怎样才能做到这
  • 从字节数组设置 img src

    我需要设置img src我在对象中拥有的字节数组的属性 img
  • Angular JS - 使服务可以从控制器和视图全局访问

    假设我们有以下服务 myApp factory FooService function 然后 从控制器中 我会说 myApp controller FooCtrl scope FooService function scope FooSer
  • 如何从 CSS 选择器中提取类名?

    故事 我目前正在构建一个 ESLint 规则 以警告在 CSS 选择器定位器中使用引导布局导向和角度技术类 目前我在字符串方法中使用简单的子字符串 for var i 0 i lt prohibitedClasses length i if
  • 为什么 call 比 apply 快那么多?

    我想知道是否有人知道why call比apply 在 Chrome 中 速度大约快 4 倍 在 Firefox 中快 30 倍 我什至可以制作自定义原型 apply2 在大多数情况下 运行速度是apply 这个想法取自角度 Function
  • 如何将MathJax公式转换为img

    Mathjax 现在在我的项目中运行良好 但有一个问题 有没有办法将MathJax的公式 纯html和css 转换成img文件 我可以保存 MathJax 可以配置为生成 SVG 看http docs mathjax org en late
  • jQuery Mobile + Admob:轮换?

    我使用 jQuery Mobile 框架创建了一个移动应用程序 所有页面都在index php中加载 使用 div 在每个页面的页脚中 我添加了Admob代码 div div div
  • 将 html 文本框的值分配给 div 的标题

    line 1

随机推荐

  • 简单记录vue下单元测试及Mock数据

    1 vue cli 创建一个demo 创建一个 demo vue create demo 在VUE CLI 是有提供测试插件的 所以在构建项目时选择一个测试框架 运行测试脚本 在package json 中可以看到运行测试脚本命令 npm
  • 倾心倾力之作《Qt 5.9 C++开发指南》

    五一假期前收到了人民邮电出版社寄来的书 我们写的 Qt 5 9 C 开发指南 终于印刷出来了 从2016年11月开始写书 到今天终于印刷出版 历时约一年半 现在它终于面世了 成书过程 由于做项目的需要 在2014年开始转而用Qt编写软件 在
  • 301与302区别

    301与302区别 定义如下 301 Moved Permanently 被请求的资源已永久移动到新位置 并且将来任何对此资源的引用都应该使用本响应返回的若干个URI之一 如果可能 拥有链接编辑功能的客户端应当自动把请求的地址修改为从服务器
  • springboot多模块开发中实现打包

    前言 因为我使用的是idea社区版 所以在创建项目的时候他没有springboot的选项 所以只能创建普通maven项目 创建完成查看项目结构和pom文件 这里我并没有觉得有什么不对劲 所以没管 就去搭建其他模块了 这里就不展示了 后来我需
  • python函数与Lambda表达式

    python函数与Lambda表达式 函数的定义 def functionname parameters 函数 文档字符串 function suite return expression 函数定义的参数为形参 表示表示占据一个参数位置 传
  • Sql Server查询语句

    文章目录 Sql Server查询语句 基础查询 条件查询 模糊查询 Sql Server查询语句 对于Sql Server创建的表中的数据进行查询 可以进行 基础查询 条件查询 模糊查询 基础查询 基础查询语句为 select from
  • 央行数字货币研究所、中国信通院合作立项2项区块链国际标准

    国际电信联盟第十六研究组 简称ITU T SG16 于2021年4月19日至2021年4月30日召开全体会议 来自中国 美国 德国 巴西 西班牙 俄罗斯 瑞士 加拿大 英国 韩国 日本等国家和世界卫生组织等国际组织的百余名代表参加了此次为期
  • spring三级缓存总结

    前言 其实说到spring的三级缓存 也是经常被提到 自己也看过对应的源码 但是 总觉得自己还是没有真正的理解 为什么这样说呢 因为每次看到三级缓存相关的技术问题 自己心里感觉还是迷糊的 不知道为什么要有三级缓存 一级缓存不行吗 二级缓存是
  • unity3d学习笔记-动画(2.控制动画与Animator Controller)

    一 探索Animator Controller动画控制器 每当为选定的游戏对象创建第一个动画剪辑时 就会自动创建动画器组件 Animator负责分配动画 但是 它不控制实际的动画剪辑 这个任务落到了动画控制器身上 它也是用第一个动画剪辑自动
  • $.ajax如何在response中获取请求头

    ajax如何在response中获取请求头 下载文件时需要获取后端带在responseHeader中的文件名称 ajax type get url http xxxx currentuser contentType application
  • Qt操作excel的三方库Qtxlsx在Windows下使用注意事项

    Qt操作excel的三方库Qtxlsx在Windows下使用注意事项 文章目录 Qt操作excel的三方库Qtxlsx在Windows下使用注意事项 1 Qt Xlsx简介 2 编译及添加模块 2 1 下载及编译 2 2 拷贝相关文件集成到
  • WebGL 杂记

    WebGL 2D RotationHow to rotate in 2Dhttps webglfundamentals org webgl lessons webgl 2d rotation html 假设您有一个矩形 并且想要旋转它 在开
  • java 删除文件路径下的指定文件

    起因 租赁项目过期或未按指定机器被套用 检测到违反规定 需要删除数据库并删除重要文件 本文主要解决问题 删除文件夹下的指定文件 解决方案 import java io File public class TestMain public st
  • 水星迷你无线路由器ap模式 下要不要启用 dhcp服务器,水星(Mercury)Mini无线路由器AP模式设置...

    本文介绍了水星 MERCURY Mini系列无线路由器AP模式的设置方法 水星迷你路由器实现了即插即用 非常适合出差或者在旅行途中入住酒店时使用 直接把酒店房间里面的网线插在水星迷你无线路由器上 就可以正常使用了 下面以水星MW150RM迷
  • 编程 打油诗_CNC操机10年老员工献给大家的一首心酸打油诗

    操机苦 倒班累 操机倒班活受罪 半夜起 早晨睡 好比参加革命游击队 整日在思 彻夜不能寐 工作不顺奖金全作废 煎熬一夜 下班打瞌睡 吃个早餐凌晨还得排队 洗漱列队 厕所抢位 回到宿舍心神疲惫 请假难请 扣钱双倍 每天都在请假排队 数控操机何
  • Android之使用本地缓存数据

    前言 在通常做项目的时候 需要存储数据 会使用GreenDAO数据库 bmob后端云 或者其他方法 以及本篇文章所讲解的本地缓存 也就是通过SharedPreferences 来进行缓存 第一部分 1 那么首先呢需要创建一个缓存数据的类Ca
  • python编程中的注意事项

    虚拟环境 win下的虚拟环境创建 virtualenv name python 3 7 9 conda创建虚拟环境 conda create prefix home coData venv python 3 8 conda环境恢复 起因 c
  • 我的128创作纪念日

    机缘 写CSDN博客的时候 应该纯属一个巧合 还记得当初是和一个班上的同学一起记录学习笔记 最初是在博客园的平台上记录笔记 可以在以后复习时使用 后来我的同学开始推荐使用CSDN平台 于是我们两就转战CSDN啦 不知不觉 从3月份到现在也有
  • PyQt中的多线程QThread示例

    PyQt中的多线程 一 PyQt中的多线程 二 创建线程 2 1 设计ui界面 2 2 设计工作线程 2 3 主程序设计 三 运行结果示例 一 PyQt中的多线程 传统的图形用户界面应用程序都只有一个执行线程 并且一次只执行一个操作 如果用
  • Vscode:常用插件 & 快捷键 & 配置等

    一 常用插件 1 git相关的 1 在代码中显示git提交日志 包含Git账号 commit信息 给Vscode添加Git功能 GitLens Git supercharged 2 显示图形化的瀑布时间线Git记录 可基于某个分支创建新分支