在前端的開發過程中，如果有一個比較好的開發工具，配合一些常用的快捷鍵，開發效率將大大提升，正所謂工具善其事必先利其器。前端推薦使用編輯器VS code,用過HB-X，ST3,Webstorm等編譯器之后就會發現，前端編輯器最屌的還是VS code。

官方文檔：

https://code.visualstudio.com/docs/getstarted/keybindings

官方快捷鍵PDF：

windows: https://code.visualstudio.com/shortcuts/keyboard-shortcuts-windows.pdf

macOS: https://code.visualstudio.com/shortcuts/keyboard-shortcuts-macos.pdf

主命令

F1 或?Ctrl+Shift+P?: 打開命令面板。在打開的輸入框內，可以輸入任何命令。

這個比較常用的是安裝插件或者查找文件，我一般都是用來查找項目文件，插件的話一般直接在擴展程序中安裝。

編輯器與窗口管理

新建文件: ? Ctrl+N

文件之間切換: ? Ctrl+Tab

打開一個新的VS Code編輯器: ? ?Ctrl+Shift+N

關閉當前窗口: ? Ctrl+W

關閉當前的VS Code編輯器: ? Ctrl+Shift+W

切出一個新的編輯器窗口（最多3個): ? Ctrl+\

切換左中右3個編輯器窗口的快捷鍵: ? Ctrl+1 ?Ctrl+2 ?Ctrl+3

格式調整

代碼行向左或向右縮進: ? Ctrl+[ 、 Ctrl+]

復制或剪切當前行/當前選中內容: ? Ctrl+C 、 Ctrl+V

代碼格式化: ? Shift+Alt+F

向上或向下移動一行: ? Alt+Up 或 Alt+Down

向上或向下復制一行: ? Shift+Alt+Up 或 Shift+Alt+Down

在當前行下方插入一行: ? Ctrl+Enter

在當前行上方插入一行: ? Ctrl+Shift+Enter

光標相關

移動到行首: ? Home

移動到行尾: ? End

移動到文件結尾: ? Ctrl+End

移動到文件開頭: ? Ctrl+Home

移動到定義處: ? F12

查看定義處縮略圖(只看一眼而不跳轉過去): ? ?Alt+F12

選擇從光標到行尾的內容: ? Shift+End

選擇從光標到行首的內容：Shift+Home

刪除光標右側的所有內容(當前行): ? Ctrl+Delete

擴展/縮小選取范圍：Shift+Alt+Right 和 Shift+Alt+Left

多行編輯(列編輯): ? Alt+Shift+鼠標左鍵 或 Ctrl+Alt+Down/Up

同時選中所有匹配編輯(與當前行或選定內容匹配): ? Ctrl+Shift+L

下一個匹配的也被選中: ? Ctrl+D

回退上一個光標操作: ? Ctrl+U

撤銷上一步操作: Ctrl+Z

手動保存: ? Ctrl+S

重構代碼

找到所有的引用：Shift+F12

同時修改本文件中所有匹配的：Ctrl+F12

查看 diff：在 explorer 里選擇文件右鍵Set file to compare，然后需要對比的文件上右鍵選擇

Compare with file_name_you_chose

查找替換

查找Ctrl+F

查找替換Ctrl+H

整個文件夾中查找Ctrl+Shift+F

顯示相關

全屏顯示(再次按則恢復): ? F11

放大或縮小(以編輯器左上角為基準): ? Ctrl +/-

側邊欄顯示或隱藏：Ctrl+B

顯示資源管理器(光標切到側邊欄中才有效): ? Ctrl+Shift+E

顯示搜索(光標切到側邊欄中才有效): ? Ctrl+Shift+F

顯示(光標切到側邊欄中才有效): ? Git Ctrl+Shift+G

顯示 Debug: ? ?Ctrl+Shift+D

顯示 Output: ? ?Ctrl+Shift+U

其他設置

自動保存：File -> AutoSave(中文界面下“文件”->“自動保存”) 或者 Ctrl+Shift+P，輸入 auto

好啦，本期內容就分享到這里，我們下期見！

總結

以上是生活随笔為你收集整理的VS code常用的快捷键的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。