首页 前端知识 VS Code 的常用快捷键和插件

VS Code 的常用快捷键和插件

2024-05-06 09:05:04 前端知识 前端哥 105 380 我要收藏

一.vs code 的常用快捷键

1.注释:
a) 单行注释:[ctrl+k,ctrl+c] 或 ctrl+/b) 取消单行注释:[ctrl+k,ctrl+u] (按下ctrl不放,再按k + u)

c) 多行注释:[alt+shift+A]

d) 多行注释:/**

2、移动行:alt+up/down

3、显示/隐藏左侧目录栏 ctrl + b

4、复制当前行:shift + alt +up/down

5、删除当前行:shift + ctrl + k

6、控制台终端显示与隐藏:ctrl + ~

7、查找文件/安装vs code 插件地址:ctrl + p

8、代码格式化:shift + alt +f

9、新建一个窗口 : ctrl + shift + n

10、行增加缩进: ctrl + [

11、行减少缩进: ctrl + ]

12、裁剪尾随空格(去掉一行的末尾那些没用的空格) : ctrl + shift + x

13、字体放大/缩小: ctrl + ( + 或 - )

14、拆分编辑器 : ctrl + 1/2/3

15、切换窗口 : ctrl + shift + left/right

16、关闭编辑器窗口 : ctrl + w

17、关闭所有窗口 : ctrl + k + w

18、切换全屏 : F11

19、自动换行 : alt + z

20、显示git : ctrl + shift + g

21、全局查找文件:ctrl + shift + f

22、显示相关插件的命令(如:git log):ctrl + shift + p

23、选中文字:shift + left / right / up / down

24、折叠代码: ctrl + k + 0-9 (0是完全折叠)

25、展开代码: ctrl + k + j (完全展开代码)

26、删除行 : ctrl + shift + k

27、快速切换主题:ctrl + k / ctrl + t

28、快速回到顶部 : ctrl + home

29、快速回到底部 : ctrl + end

30、格式化选定代码 :ctrl + k / ctrl +f

二.vs code 的常用插件

1、Auto Rename Tag 修改html标签,自动帮你完成尾部闭合标签的同步修改,和webstorm一样。

2、Auto Close Tag 自动闭合HTML标签

4、Beautiful 格式化代码的工具

5、Dash Dash是MacOS的API文档浏览器和代码段管理器

6、Ejs Snippets ejs 代码提示

7、ESLint 检查javascript语法错误与提示

8、File Navigator 快速查找文件

9、Git History(git log) 查看git log

10、Gulp Snippets 写gulp时用到,gulp语法提示。

11、HTML CSS Support 在HTML标签上写class智能提示当前项目所支持的样式

12、HTML Snippets 超级好用且初级的H5代码片段以及提示

13、Debug for Chrome 让vs code映射chrome的debug功能,静态页面都可以用vscode来打断点调试、配饰稍微复杂一点

14、Document this Js的注释模板

15、jQuery Code Snippets jquery提示工具

16、Html2jade html模板转pug模板

17、JS-CSS-HTML Formatter 格式化

18、Npm intellisense require 时的包提示工具

19、Open in browser 打开默认浏览器

20、One Dark Theme 一个vs code的主题

21、Path Intellisense 自动路径补全、默认不带这个功能

22、Project Manager 多个项目之间快速切换的工具

23、Pug(Jade) snippets pug语法提示

24、React Components 根据文件名创建反应组件代码。

25、React Native Tools reactNative工具类为React Native项目提供了开发环境。

26、Stylelint css/sass代码审查

27、Typings auto installer 安装vscode 的代码提示依赖库,基于typtings的

28、View In Browser  默认浏览器查看HTML文件(快捷键Ctrl+F1可以修改)

29、Vscode-icons 让vscode资源目录加上图标、必备

30、VueHelper Vue2代码段(包括Vue2 api、vue-router2、vuex2)

31、Vue 2 Snippets vue必备vue代码提示

32、Vue-color vue语法高亮主题

33、Auto-Open Markdown Preview markdown文件自动开启预览

34、EverMonkey 印象笔记

35、atom one dark atom的一个高亮主题(个人推荐)

三.常用的电脑快捷键

1、ctrl + shift + delete 快速清除浏览器缓存

2、ctrl + alt + delete 快速进入任务管理器页面

3、window + L 快速锁定电脑

4、window + d 所有窗口最小化

5、 window + e 打开我的资源管理器(我的电脑)

6、 window + f 快速打开搜索窗口

7、 alt + tab 快速查看打开的应用与窗口

VS Code 快捷键(中英文对照版)

常用 General

按 Press功能Function
Ctrl + Shift + P,F1显示命令面板Show Command Palette
Ctrl + P快速打开Quick Open
Ctrl + Shift + N新窗口/实例New window/instance
Ctrl + Shift + W关闭窗口/实例Close window/instance

基础编辑 Basic editing

按 Press功能Function
Ctrl+X剪切行(空选定)Cut line (empty selection)
Ctrl+C复制行(空选定)Copy line (empty selection)
Alt+ ↑ / ↓向上/向下移动行Move line up/down
Shift+Alt + ↓ / ↑向上/向下复制行Copy line up/down
Ctrl+Shift+K删除行Delete line
Ctrl+Enter在下面插入行Insert line below
Ctrl+Shift+Enter在上面插入行Insert line above
Ctrl+Shift+\跳到匹配的括号Jump to matching bracket
Ctrl+] / [缩进/缩进行Indent/outdent line
Home转到行首Go to beginning of line
End转到行尾Go to end of line
Ctrl+Home转到文件开头Go to beginning of file
Ctrl+End转到文件末尾Go to end of file
Ctrl+↑ / ↓向上/向下滚动行Scroll line up/down
Alt+PgUp / PgDown向上/向下滚动页面Scroll page up/down
Ctrl+Shift+[折叠(折叠)区域Fold (collapse) region
Ctrl+Shift+]展开(未折叠)区域Unfold (uncollapse) region
Ctrl+K Ctrl+[折叠(未折叠)所有子区域Fold (collapse) all subregions
Ctrl+K Ctrl+]展开(未折叠)所有子区域Unfold (uncollapse) all subregions
Ctrl+K Ctrl+0折叠(折叠)所有区域Fold (collapse) all regions
Ctrl+K Ctrl+J展开(未折叠)所有区域Unfold (uncollapse) all regions
Ctrl+K Ctrl+C添加行注释Add line comment
Ctrl+K Ctrl+U删除行注释Remove line comment
Ctrl+/切换行注释Toggle line comment
Shift+Alt+A切换块注释Toggle block comment
Alt+Z切换换行Toggle word wrap

导航Navigation

按 Press功能Function
Ctrl + T显示所有符号Show all Symbols
Ctrl + G转到行…Go to Line…
Ctrl + P转到文件…Go to File…
Ctrl + Shift + O转到符号…Go to Symbol…
Ctrl + Shift + M显示问题面板Show Problems panel
F8转到下一个错误或警告Go to next error or warning
Shift + F8转到上一个错误或警告Go to previous error or warning
Ctrl + Shift + Tab导航编辑器组历史记录Navigate editor group history
Alt + ←/→返回/前进Go back / forward
Ctrl + M切换选项卡移动焦点Toggle Tab moves focus

搜索和替换 Search and replace

按 Press功能Function
Ctrl + F查找Find
Ctrl + H替换Replace
F3 / Shift + F3查找下一个/上一个Find next/previous
Alt + Enter选择查找匹配的所有出现Select all occurences of Find match
Ctrl + D将选择添加到下一个查找匹配Add selection to next Find match
Ctrl + K Ctrl + D将最后一个选择移至下一个查找匹配项Move last selection to next Find match
Alt + C / R / W切换区分大小写/正则表达式/整个词Toggle case-sensitive / regex / whole word

多光标和选择 Multi-cursor and selection
按 Press 功能 Function

Alt +单击 插入光标 Insert cursor

按 Press功能Function
Ctrl + Alt +↑/↓在上/下插入光标Insert cursor above / below
Ctrl + U撤消上一个光标操作Undo last cursor operation
Shift + Alt + I在选定的每一行的末尾插入光标Insert cursor at end of each line selected
Ctrl + I选择当前行Select current line
Ctrl + Shift + L选择当前选择的所有出现Select all occurrences of current selection
Ctrl + F2选择当前字的所有出现Select all occurrences of current word
Shift + Alt + →展开选择Expand selection
Shift + Alt + ←缩小选择Shrink selection
Shift + Alt +(拖动鼠标) 列(框)选择Column (box) selection
Ctrl + Shift + Alt +(箭头键) 列(框)选择Column (box) selection
Ctrl + Shift + Alt + PgUp / PgDown列(框)选择页上/下Column (box) selection page up/down

丰富的语言编辑 Rich languages editing

按 Press功能Function
Ctrl +空格 触发建议Trigger suggestion
Ctrl + Shift + Space触发器参数提示Trigger parameter hints
Tab Emmet展开缩写Emmet expand abbreviation
Shift + Alt + F格式化文档Format document
Ctrl + K Ctrl + F格式选定区域Format selection
F12转到定义Go to Definition
Alt + F12Peek定义Peek Definition
Ctrl + K F12打开定义到边Open Definition to the side
Ctrl +. 快速解决Quick Fix
Shift + F12显示引用Show References
F2重命名符号Rename Symbol
Ctrl + Shift + . /,替换为下一个/上一个值Replace with next/previous value
Ctrl + K Ctrl + X修剪尾随空格Trim trailing whitespace
Ctrl + K M更改文件语言Change file language

编辑器管理 Editor management

按 Press功能Function
Ctrl+F4, Ctrl+W关闭编辑器Close editor
Ctrl+K F关闭文件夹Close folder
Ctrl+| 拆分编辑器Split editor
Ctrl+ 1 / 2 / 3聚焦到第1,第2或第3编辑器组Focus into 1st, 2nd or 3rd editor group
Ctrl+K Ctrl+ ←/→聚焦到上一个/下一个编辑器组Focus into previous/next editor group
Ctrl+Shift+PgUp / PgDown向左/向右移动编辑器Move editor left/right
Ctrl+K ← / →移动活动编辑器组Move active editor group

文件管理 File management

按 Press功能Function
Ctrl+N新文件New File
Ctrl+O打开文件…Open File…
Ctrl+S保存Save
Ctrl+Shift+S另存为…Save As…
Ctrl+K S全部保存Save All
Ctrl+F4关闭Close
Ctrl+K Ctrl+W关闭所有Close All
Ctrl+Shift+T重新打开关闭的编辑器Reopen closed editor
Ctrl+K输入保持打开Enter Keep Open
Ctrl+Tab打开下一个Open next
Ctrl+Shift+Tab打开上一个Open previous
Ctrl+K P复制活动文件的路径Copy path of active file
Ctrl+K R显示资源管理器中的活动文件Reveal active file in Explorer
Ctrl+K O显示新窗口/实例中的活动文件Show active file in new window/instance

显示 Display

按 Press功能Function
F11切换全屏Toggle full screen
Shift+Alt+1切换编辑器布局Toggle editor layout
Ctrl+ = / -放大/缩小Zoom in/out
Ctrl+B切换侧栏可见性Toggle Sidebar visibility
Ctrl+Shift+E显示浏览器/切换焦点Show Explorer / Toggle focus
Ctrl+Shift+F显示搜索Show Search
Ctrl+Shift+G显示Git Show Git
Ctrl+Shift+D显示调试Show Debug
Ctrl+Shift+X显示扩展Show Extensions
Ctrl+Shift+H替换文件Replace in files
Ctrl+Shift+J切换搜索详细信息Toggle Search details
Ctrl+Shift+C打开新命令提示符/终端Open new command prompt/terminal
Ctrl+Shift+U显示输出面板Show Output panel
Ctrl+Shift+V切换Markdown预览Toggle Markdown preview
Ctrl+K V从旁边打开Markdown预览Open Markdown preview to the side

调试 Debug

按 Press功能Function
F9切换断点Toggle breakpoint
F5开始/继续Start/Continue
Shift+F5停止Stop
F11 / Shift+F11下一步/上一步Step into/out F10 跳过 Step over
Ctrl+K Ctrl+I显示悬停Show hover

集成终端 Integrated terminal

按 Press功能Function
Ctrl+`显示集成终端Show integrated terminal
Ctrl+Shift+`创建新终端Create new terminal
Ctrl+Shift+C复制选定Copy selection
Ctrl+Shift+V粘贴到活动端子Paste into active terminal
Ctrl+↑ / ↓向上/向下滚动Scroll up/down
Shift+PgUp / PgDown向上/向下滚动页面Scroll page up/down
Ctrl+Home / End滚动到顶部/底部Scroll to top/bottom
转载请注明出处或者链接地址:https://www.qianduange.cn//article/7159.html
标签
评论
发布的文章

HTML5-新增表单元素

2024-05-10 08:05:59

Dayjs 的一些常用方法

2024-05-10 08:05:59

Howler.js HTML5声音引擎

2024-05-10 08:05:59

前端攻城狮HTML5自查手册

2024-05-10 08:05:51

JavaScript 基础入门

2024-05-10 08:05:41

HTML5新手入门指南

2024-05-08 10:05:28

大家推荐的文章
会员中心 联系我 留言建议 回顶部
复制成功!