vscode: Visual Studio Code 經常使用快捷鍵

https://lzw.me/a/vscode-visual-studio-code-shortcut.html

主命令框

F1 或 Ctrl+Shift+P : 打開命令面板。在打開的輸入框內，能夠輸入任何命令，例如：

• 按一下 Backspace 會進入到 Ctrl+P 模式
• 在 Ctrl+P 下輸入 > 能夠進入 Ctrl+Shift+P 模式
• 在 Ctrl+P 窗口下還能夠:
  -直接輸入文件名，跳轉到文件

   

  • ? 列出當前可執行的動做
  • ! 顯示 Errors或 Warnings，也能夠 Ctrl+Shift+M
  • : 跳轉到行數，也能夠 Ctrl+G 直接進入
  • @ 跳轉到 symbol（搜索變量或者函數），也能夠 Ctrl+Shift+O 直接進入
  • @ 根據分類跳轉 symbol，查找屬性或函數，也能夠 Ctrl+Shift+O 後輸入:進入
  • # 根據名字查找 symbol，也能夠 Ctrl+T

經常使用快捷鍵

編輯器與窗口管理

• 打開一個新窗口： Ctrl+Shift+N
• 關閉窗口： Ctrl+Shift+W
• 同時打開多個編輯器（查看多個文件）
• 新建文件 Ctrl+N
• 文件之間切換 Ctrl+Tab
• 切出一個新的編輯器（最多 3 個） Ctrl+\，也能夠按住 Ctrl 鼠標點擊 Explorer 裏的文件名
• 左中右 3 個編輯器的快捷鍵 Ctrl+1 Ctrl+2 Ctrl+3
• 3 個編輯器之間循環切換 Ctrl+
• 編輯器換位置， Ctrl+k而後按 Left或 Right

代碼編輯

格式調整

• 代碼行縮進: Ctrl+[ 、 Ctrl+]
• Ctrl+C 、 Ctrl+V 複製或剪切當前行/當前選中內容
• 代碼格式化： Shift+Alt+F，或 Ctrl+Shift+P 後輸入 format code
• 上下移動一行： Alt+Up 或 Alt+Down
• 向上向下複製一行： Shift+Alt+Up 或 Shift+Alt+Down
• 在當前行下邊插入一行: Ctrl+Enter
• 在當前行上方插入一行 Ctrl+Shift+Enter

光標相關

• 移動到行首： Home
• 移動到行尾： End
• 移動到文件結尾： Ctrl+End
• 移動到文件開頭： Ctrl+Home
• 移動到定義處： F12
• 定義處縮略圖：只看一眼而不跳轉過去 Alt+F12
• 移動到後半個括號： Ctrl+Shift+]
• 選擇從光標到行尾： Shift+End
• 選擇從行首到光標處： Shift+Home
• 刪除光標右側的全部字： Ctrl+Delete
• 擴展/縮小選取範圍： Shift+Alt+Left 和 Shift+Alt+Right
• 多行編輯(列編輯)：Alt+Shift+鼠標左鍵， Ctrl+Alt+Down/Up
• 同時選中全部匹配： Ctrl+Shift+L
• Ctrl+D 下一個匹配的也被選中 (在 sublime 中是刪除當前行，後面自定義快鍵鍵中，設置與 Ctrl+Shift+K 互換了)
• 回退上一個光標操做： Ctrl+U
• 選中全部匹配詞批量編輯：鼠標高亮選中須要查找的詞，按下 Ctrl + Shift + L鍵，便可快速選中當前文件中全部匹配的詞，並在每個詞後面有一個編輯光標，可批量同步編輯

重構代碼

• 找到全部的引用： Shift+F12
• 同時修改本文件中全部匹配的： Ctrl+F12
• 重命名：好比要修改一個方法名，能夠選中後按 F2，輸入新名字，回車，則全部該方法的引用也都同步更新了
• 跳轉到下一個 Error 或 Warning：當有多個錯誤時能夠按 F8 逐個跳轉
• 查看 diff： 在 explorer 裏選擇文件右鍵 Set file tocompare，而後須要對比的文件上右鍵選擇 Compare with file_name_you_chose

查找替換

• 查找 Ctrl+F
• 查找替換 Ctrl+H
• 整個文件夾中查找 Ctrl+Shift+F

顯示相關

• 全屏：F11
• zoomIn/zoomOut：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

修改默認快捷鍵

打開默認鍵盤快捷方式設置：File -> Preferences -> Keyboard Shortcuts，或者：Alt+F -> p -> k

修改 keybindings.json：

01	// Place your key bindings in this file to overwrite the defaults

02

[

03	// ctrl+space 被切換輸入法快捷鍵佔用

04

{

05	"key": "ctrl+alt+space",

06	"command": "editor.action.triggerSuggest",

07	"when": "editorTextFocus"

08

},

09	// ctrl+d 刪除一行

10

{

11	"key": "ctrl+d",

12	"command": "editor.action.deleteLines",

13	"when": "editorTextFocus"

14

},

15	// 與刪除一行的快捷鍵互換

16

{

17	"key": "ctrl+shift+k",

18	"command": "editor.action.addSelectionToNextFindMatch",

19	"when": "editorFocus"

20

},

21	// ctrl+shift+/多行註釋

22

{

23	"key":"ctrl+shift+/",

24	"command": "editor.action.blockComment",

25	"when": "editorTextFocus"

26

},

27	// 定製與 sublime 相同的大小寫轉換快捷鍵

28	editor.action.transformToLowercase

29	editor.action.transformToUppercase

30

{

31	"key": "ctrl+k ctrl+u",

32	"command": "editor.action.transformToUppercase"

33	"when": "editorTextFocus"

34

},

35

{

36	"key": "ctrl+k ctrl+l",

37	"command": "editor.action.transformToLowercase"

38	"when": "editorTextFocus"

39

}

40

]

前端開發必備插件

• PostCSS Sorting
• stylelint
• stylefmt
• ESLint
• javascript standard format
• beautify
• Babel ES6/ES7
• Debugger for Chrome
• Add jsdoc comments
• javascript(ES6) code snippets
• vue
• weex
• Reactjs code snippets
• React Native Tools
• Npm Intellisense
• Instant Markdown
• Markdown Shortcuts
• TextTransform

使用等寬字體：

• Fira Code

vscode 自定義配置參考：

01

{

02	"editor.fontSize": 16,

03	"editor.tabSize": 2,

04	"editor.fontLigatures": true,

05	// 使用等寬字體 Fira Code

06	"editor.fontFamily": "Fira Code, 'Noto Sans CJK SC Medium', Consolas, 'Courier New', monospace",

07	// 關閉右側的 minimap

08	"editor.minimap.enabled": false,

09	"editor.minimap.renderCharacters": false,

10	"files.associations": {

11	"*.es": "javascript",

12	"*.es6": "javascript"

13

},

14	// 控制編輯器是否應呈現空白字符

15	"editor.renderWhitespace": "all",

16	// 啓用後，將在保存文件時剪裁尾隨空格。

17	"files.trimTrailingWhitespace": true,

18	// File extensions that can be beautified as javascript or JSON.

19	"beautify.JSfiles": [

20

"",

21

"es",

22

"es6",

23

"js",

24

"json",

25	"jsbeautifyrc",

26	"jshintrc"

27

],

28	// 關閉 git 自動刷新、fetch、add 操做

29	"git.enableSmartCommit": false,

30	"git.enabled": true,

31	"git.autorefresh": false,

32	"git.autofetch": false,

33

}

更多參考

• 官方快捷鍵大全：https://code.visualstudio.com/docs/customization/keybindin