『力薦彙總』這些 VS Code 快捷鍵太好用，忍不住錄了這34張gif動圖

Piper蛋窩發表於2021-03-05

之前寫過三篇文章，收穫了極其不錯的閱讀量與轉發量：

一方面，我確實將 VS Code 作為自己的主力編輯器：遠端操作時用、寫筆記時用、寫程式碼（C++/Python/JavaScript）時也用，我已經具有了些許心得與經驗；另一方面，自己也很喜歡積累或閱讀相關資料（比如韓駿老師的《Visual Studio Code 權威指南》），並且在實踐與學習中做成筆記（比如錄製gif）。

本文將彙總我錄製的 34 張 gif 動圖，為讀者朋友推薦並整理『遠離滑鼠，提升效率』的 VS Code 快捷操作。

本文大綱：

  • 6 個 Ctrl+Shift+Alt 組合
  • 8 個你可能不知道的重要操作
  • 3 個有趣又通用的小眾外掛
  • 5+ 的 vim + vscode 操作

6 個 Ctrl+Shift+Alt 組合

Ctrl

Ctrl 控制螢幕的移動與游標的移動。

Ctrl + 左右

Ctrl 加上左右鍵，以單詞為單位跳轉。

Ctrl + 上下

Ctrl 加上上下鍵，小幅度滾動螢幕（滾動一行）。

Shift

Shift 相當於「拖動滑鼠」，與方向鍵結合選中文字。

Shift + 上下左右

有了 Shift ，不再用滑鼠拖動。

Alt

Alt 較為特殊。

Alt + 上下

Alt 與上下鍵結合，英文叫做「copy line」，相當於拖著這一行上下移動。

Alt + 左右

Alt 與左右鍵結合，實現「跳轉」。比如我們去看某個函式的定義，我們跳轉過去，當我們看完了，想要跳轉回來時，不需要再動腦回找，直接使用 Alt + ← 即可（Alt + backspace同）。

Ctrl + Shift

Ctrl + Shift + 上下左右

Ctrl + Shift + 上下左右 較好理解，相當於 Ctrl 與 Shift 相結合， Shift 起選中的作用， Ctrl 則讓方向鍵的步長更長（以單詞為單位）。

Ctrl + Alt

Ctrl + Alt + 上下

Ctrl + Alt + 上下 是 多游標 。注意使用 Escape 退出多游標模式。

Shift + Alt

Shift + Alt + 上下

Shift + Alt + 上下，複製這一行。

8 個你可能不知道的重要操作

F12 跳轉引用

使用 F12 實現跳轉

如上圖：

  • F12 跳轉到變數、函式、類的定義處
  • Shift + F12 跳轉到其引用處；多個引用時，可以選擇具體哪個 reference

使用 F12 也可以跳轉到環境庫的原始碼中，如下圖，我跳轉到了庫 gym （使用 conda 安裝到 lib）的 core.py 。

F12 跳轉到 gym 庫的定義中

查詢與替換

Ctrl + F 恐怕在任何軟體中都很常用

使用 Ctrl + F 可以進行查詢；使用 Ctrl + H 則彈出替換視窗。如上，我將 foo 替換為 foobar ，使用 Alt + R 支援正則語法。

Ctrl + Shift + P

Ctrl + Shift + P 恐怕是各個編輯器、偵錯程式中最常用的操作了：彈出命令視窗，然後我們輸入相關命令的名稱，回車則執行該命令。

Ctrl + Shift + P

如上圖，我使用 Ctrl + Shift + P ，執行 View: Split Editor Right 命令，接著，使用 Ctrl + P 呼叫出視窗切換器（檔案切換器）。

切換視窗

處於一堆、相互重疊的檔案， VS code 稱其為一個「group」。我們通常要用到「group的組內切換」和「group間切換」。

group 切換

如上圖，Ctrl + <你要去的 group 編號> 來把游標（的注意力 focus）集中到你要去的 group 上。上面 Ctrl + 1 切換到左邊的 group ；Ctrl + 2 切換到右邊的 group 。

而 Alt + <數字> 則是在 group 內切換標籤頁。

此外，注意到 Ctrl + Shift + E 開啟或關閉檔案管理器 Explorer ，就是左側的那個樹狀圖。而 Ctrl + B 是開關 Side Bar ，即側邊欄。

新建、關閉與除錯臺

使用 Ctrl + ~ 開關終端，而 Ctrl + J 則是開關 Panel ，即含有終端、偵錯程式的底部容器。

新建、關閉與除錯臺

此外，Ctrl + N 是新建檔案，Ctrl + W 是關閉當前檔案（這在所有 windows 應用上幾乎都適用）。

禪模式

有時候，節目顯得過於複雜臃腫，分散了我們的注意力，視野不清爽，也會降低舒適度。使用禪模式 Zen Mode 則會遮蔽這些干擾。

開關禪模式

可以使用 Ctrl + Shift + P 輸入 Zen 來呼叫相關命令。此外，我將其快捷鍵改為了（在左下角的小齒輪的 Keymaps 中更改） Ctrl + Alt + Z ，如上圖，甚是舒爽。

group size

一塊小小的顯示器，還要被兩個或以上的 group 平分割槽域，我們的程式碼閱讀螢幕實在是太『窄』了。

group size

如上圖，我們可以用 Toggle Editor Group Sizes 來切換閱讀模式，讓其更寬一些。我設定了其快捷鍵為 Ctrl + Alt + G 。

Ctrl + i / Ctrl + /

如下圖，使用 Ctrl + i 可以呼叫程式碼提示，而 Ctrl + / 可以將選中的文字註釋掉，或者取消註釋。

Ctrl + i 程式碼提示

3 個有趣又通用的小眾外掛

外掛：vscode-input-sequence

一個 vscode-input-sequence 解決了我們輸入序列資料的煩惱。

vscode-input-sequence

如上圖，配合多游標，我們可以輸入一個序列的資料，並且可以決定序列的遞進規則、遞進步長、佔位、進位制等。

外掛：Relative Path

Relative Path

我很喜歡 Relative Path ，如下圖，輸入 Ctrl + Shift + H 便自動補全檔案的相對路徑。

Relative Path 補全了圖片的相對路徑

外掛：Auto Markdown TOC

Auto Markdown TOC from Hunter Tran

有很多關於 markdown 自動生成目錄的外掛，我覺得對中文最友善的，應該是 Hunter Tran 的 Auto Markdown TOC 了。

使用 Auto Markdown TOC 自動生成目錄

如上，使用 Auto Markdown TOC 自動生成目錄（同樣地，在Ctrl + Shift + P 中呼叫相關命令）。

5+ 的 vim + vscode 操作

Vim 外掛安裝

下載 Vim 外掛

如上圖，下載 Vim 外掛。這裡需要注意，強烈推薦 不使用Vim自帶的組合快捷鍵 Ctrl ，因為其會覆蓋掉 VS Code 本身的快捷鍵以及其他外掛的快捷鍵 。

取消勾選 useCtrlKeys 設定

如上圖，可以在 Settings 中搜尋 useCtrlKeys 配置，並取消勾選。

vim scroll

值得注意的是，我們依然可以使用 Ctrl + u 和 Ctrl + d 實現上下滾動頁面，滾動行數預設為半頁大小。

Vim 基礎

這裡要介紹的是 Vim 基礎中的基礎，但還是沒有 Vim 基礎的初學者也可以去 B 站搜尋 Vim 相關的教程再鞏固一下（我之後也可能錄視訊）。

vim 基礎

如上圖：

  • Vim 中預設是 normal 模式，此時敲擊字母是在敲擊命令，而非編輯文字；輸入 i 進入 insert 模式，此時敲擊字母才是輸入字母
  • insert 模式下，退出鍵 Escape 回到 normal 模式
  • normal 模式下，hjkl分別是左下上右

vim 中 a i o 操作

如上：

  • normal 模式下，Shift + a（以後記作A）移到行末，並轉為 insert 模式；I是行前
  • normal 模式下，o是下插一行，並跳轉

vim 中 w b 操作

如上：

  • normal 模式下，w是向前移動一個單詞，b則是向後移動一個單詞

vim 中的複製貼上

如上：

  • normal 模式下，d是開啟剪下模式，因此，dw則是剪下一個單詞；dd是剪下一行
  • normal 模式下，y則是複製，而p是貼上

vim 中 s x

如上：

  • normal 模式下，s是刪除當前游標所指並轉為 insert 模式，x是刪除並且不轉換

vim 中 g

如上：

  • normal 模式下，15gg是跳轉到15行

vim 中的 visual

如上：

  • normal 模式下，是開啟選中 visual 模式

VS Code 中常用 Vim 組合邏輯

Vim 愛好者常說：Vim是一種邏輯，而非死記硬背快捷鍵（我還算不上 Vim 愛好者，這句話不是我說的，是 Linux 社群的一些朋友們說的）。

我對於 Vim 『邏輯』的理解，大概如下：

  • 大小寫是一種相反的邏輯
  • VS Code 中一些 Ctrl 與滾動
  • i(意味著在括號裡

展開的解釋如下文。

大小寫是一種相反的邏輯

int foo_xyz = 1;
       ^

我們知道，當游標在_處時，想要刪除 _xyz ，那麼就要首先 找到最近的z的位置，然後刪除這個區間內的東西。 在 vim 中，則是輸入 dfz 來表達， fz 則是 找到 z 的意思 。

vim 中 f 與 F

那麼，向前查詢是什麼呢？答案是大寫的 F ，具體例子如上圖。

vim 中 o 與 O

如上，用 o 可以很輕鬆地向下插入一行，而用 O 則是向上插入一行。

VS Code 中一些 Ctrl 與滾動

vim 中的 []

如上，使用 Shift + [] 是以「程式碼塊」為單位跳行。

vim 中 Ctrl + []

如上，Ctrl + [] 實現縮排的調整。這裡結合了 visual 模式。

vim 中滾動

如上，[[ 跳到檔案首行，而 ]] 則是行末。

vim 中 H L M z

如上，H 是到螢幕的頂部，L 是螢幕的底部，M 是螢幕的中央；而 zz 是『將游標放到螢幕中央，且不移動游標的位置（滾動螢幕）』，zt 是將游標放到頂部，zb 是底部。

i( 意味著在括號裡

print("delete me")

如上，當我們想清空 print() 函式括號內的東西，我們「有邏輯地」告訴 vim 即可。把游標移到括號內，輸入 ci( 或 ci)，其中 i( 是『在括號內』。

一種邏輯

如上，不僅是 c 操作，也不僅僅是 () ，對於 ""、[] 等都適用。

此外，還有很多邏輯可以組合，比如：j是向下跳轉一行，那麼 10j 就是向下10行。 此外，/ 查詢功能在 vs code 中同樣適用。但是，我更喜歡 vs code 自帶的 ctrl + f 查詢。

你好，我是小拍，985大學管理科學與工程專業在讀研究生、技術愛好者與自學者，同時也是 『持續改善 · よい品よい考”』 思想的支持者和踐行者。轉載&合作&學習事宜，歡迎加我微信 PiperLHJ 交流。

相關文章