VSCode中Vue开发推荐插件和VSCode快捷键都有哪些

发布时间:2020-08-10 16:02:52 作者:小新
来源:亿速云 阅读:352

这篇文章主要介绍VSCode中Vue开发推荐插件和VSCode快捷键都有哪些,文中介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们一定要看完!

首先这几个是VSCode推荐Vue开发必备的插件

Vetur —— 语法高亮、智能感知、Emmet等
包含格式化功能, Alt+Shift+F (格式化全文),Ctrl+K Ctrl+F(格式化选中代码,两个Ctrl需要同时按着)

EsLint —— 语法纠错

Debugger for Chrome —— 映射vscode上的断点到chrome上,方便调试(配置有点麻烦,其实我没用这个)

Auto Close Tag —— 自动闭合HTML/XML标签

Auto Rename Tag —— 自动完成另一侧标签的同步修改

JavaScript(ES6) code snippets —— ES6语法智能提示以及快速输入,除js外还支持.ts,.jsx,.tsx,.html,.vue,省去了配置其支持各种包含js代码文件的时间

Path Intellisense —— 自动路劲补全

HTML CSS Support —— 让 html 标签上写class 智能提示当前项目所支持的样式

VSCode中Vue开发推荐插件和VSCode快捷键都有哪些

VSCode快捷键

常用 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
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
TabEmmet 展开缩写 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 + 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

以上是VSCode中Vue开发推荐插件和VSCode快捷键都有哪些的所有内容,感谢各位的阅读!希望分享的内容对大家有帮助,更多相关知识,欢迎关注亿速云行业资讯频道!

推荐阅读:
  1. vscode php插件以及终端快捷键有哪些
  2. vue开发工具vscode插件安装及调试

免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。

vscode vue插件 vscode快捷键

上一篇:Uniapp使用GoEasy实现websocket实时通讯

下一篇:@ResponseBody注解作用和原理

相关阅读

您好,登录后才能下订单哦!

密码登录
登录注册
其他方式登录
点击 登录注册 即表示同意《亿速云用户服务条款》