1.快速上手
命令面板
可以通過 F1
或者 Cmd+Shift+P
打開
你可以在命令面板中快速搜索命令并且執(zhí)行。如果你的 VS Code 是簡體中文版霞怀,那么你可以在命令面板里使用中文或者英文來搜索命令司顿。VS Code 的絕大多數命令都可以在命令面板里搜到赃春,所以熟練使用命令面板燕酷,你就可以擺脫鼠標喊巍,完全通過鍵盤操作來完成全部編碼工作鼎姊。
命令行的使用
如果你是在 macOS 上使用骡和,安裝后打開命令面板,搜索Shell 命令:在 PATH 中安裝 “Code” 命令
并執(zhí)行相寇,然后重啟終端模擬就可以了慰于。
運行 code --help
來打印出 VS Code 命令行所支持的所有參數。
// 打開文件
code filename
// 如果你希望使用已經打開的窗口來打開文件唤衫,可以在 code 命令后添加參數 -r來進行窗口的復用婆赠。
code -r filename
// -g打開文件后光標定位了第n行
code -r -g package.json:128
// Diff
code -r -d a.txt b.txt
VS Code 命令行除了支持打開磁盤上的文件以外,也接受來自管道中的數據佳励。這樣你就可以將原本在命令行中展示的內容休里,實時地展示在 VS Code 里,然后在編輯器中搜索和修改赃承。比如妙黍,你可以把當前目錄下所有的文件名都展示在編輯器里,此時只需使用 ls | code -
命令
2. 雙手不離鍵盤
光標的移動瞧剖、文本的選擇拭嫁、文本的刪除,以及如何為編輯器命令綁定快捷鍵
光標移動
移動到單詞首:option + 左方向鍵
移動到單詞末:option + 右方向鍵
移動到單行首:command + 左方向鍵
移動到單行末:command + 右方向鍵
對于代碼塊的光標移動
當你把光標放在花括號上時抓于,只需按下 Cmd + Shift + \
就可以在這對花括號之間跳轉做粤。
移動到文檔的第一行或者最后一行
只需按下 Cmd 和上下方向鍵
即可
文本選擇
掌握了上面的快捷鍵之后,你還可以非常輕松地掌握文本選擇的操作捉撮。因為對于基于單詞怕品、行和整個文檔的光標操作,只需要多按一個 Shift 鍵呕缭,就可以在移動光標的同時選中其中的文本堵泽。
對于代碼塊的文本選擇
VS Code沒有默認快捷鍵
- 方法1:
使用命令面板找到命令選擇括號所有內容
并運行。 - 方法2:
綁定快捷鍵
刪除操作
首先了解mac上的Backspace鍵為(fn + delete)
刪除行: shift + cmd + k
刪除光標到行首: cmd + delete
刪除光標到行尾: cmd +backspace
即 cmd + fn + delete
刪除光標的單詞首:option + delete
刪除光標到單詞尾:option + backspace
即 option + fn + delete
自定義快捷鍵
可以根據自己的使用習慣恢总,給自己常用的命令指定順手的快捷鍵迎罗。
打開命令面板,搜索 打開鍵盤快捷方式
然后執(zhí)行片仿,這時你將看到相對應的界面纹安。
然后通過搜索找到你希望修改快捷鍵的命令,雙擊,接下來你只要按下你期望的快捷鍵厢岂,最后按下回車鍵就可以了光督。
比如,你可以搜索“選擇括號所有內容”塔粒,雙擊结借,按下 "Cmd + Shift + ]",然后按下回車卒茬,這個快捷鍵就綁定上了船老。
3. 快捷鍵進階
代碼行編輯
刪除一行: cmd + shift + k
剪切行: cmd + x
當前行下面開始一行:cmd + Enter
當前行上面開始一行:cmd + shift + Enter
上下移動當前行或當前選中行:option + 上下鍵
復制這幾行,然后粘貼到當前行的上面或者下面: option + shift + 上下鍵
添加注釋
注釋掉一行: cmd + /
注釋掉選中的內容:option + shift + A
代碼格式化
使用插件完成
代碼縮進
其他小技巧
調換字符位置:ctrl + t
調整字符的大小寫: 選中內容圃酵,命令面板運行轉換為大寫
或 裝換為小寫
柳畔,來變換字符大小寫。搜索時可直接搜索tra...
前綴即可自動查找到相關命令郭赐。
將選中的多行合并為一行:ctrl + j
多行數據按字母排序:選中內容薪韩,命令面板運行 按升序排列行
或者 按降序排列行
。搜索時可直接搜索sort...
前綴即可自動查找排序相關命令捌锭。
撤銷光標的移動和選擇:cmd + u
撤銷光標的移動俘陷,光標回退到上一個位置。
4. 拒絕重復观谦,你一定要學會的多光標特性
將光標插入多行:cmd + option + 上下鍵
創(chuàng)建多光標的兩個特別命令
- “Cmd + D”
第一次按下時岭洲,它會選中光標附近的單詞;第二次按下時坎匿,它會找到這個單詞第二次出現的位置盾剩,創(chuàng)建一個新的光標,并且選中它替蔬。 -
Option + shift + i
在選中行的每行末尾插入光標
5.快速在文件告私、符號、代碼之間跳轉
文件跳轉
Ctrl+Tab
cmd + shift + ]
這兩個命令只能上一個下一個的移動承桥,命令面板里提供了支持搜索的跳轉方式驻粟。cmd + p
會彈出一個最近打開文件列表,支持搜索凶异。移動到文件按 Enter
即可打開文件蜀撑。小技巧,移動到文件剩彬,按下cmd + Enter
可在新的窗口打開文件酷麦。
行跳轉
按下 Ctrl + g
會彈出一個帶冒號的輸入框,輸入數字喉恋,回車即可將光標移動到那一行沃饶。
介紹一個高階組合技巧母廷。如果你想跳轉到某個文件的某一行,你只需要先按下 Cmd + P
糊肤,輸入文件名琴昆,然后在這之后加上 “:”和指定行號即可。
符號跳轉
VS Code 項目或者文件里有哪些類馆揉、哪些函數或者標識符(我們把這些統稱為符號)业舍。
如果要在一個文件里的符號之間跳轉,你只需按下 Cmd + Shift + O
, 就能夠看到當前文件里的所有符號升酣。使用方向鍵勤讽,或者搜索,找到你想要的符號后拗踢,按下回車,就能夠立刻跳轉到那個符號的位置向臀。
請注意巢墅,在按下 Cmd + Shift +O
后,輸入框里有一個 “@”符號券膀,這個符號在這里的意義君纫,我會在后面的章節(jié)里去介紹,你可以先留個心眼芹彬。這時蓄髓,如果你輸入 “:”,就可以將當前文件的所有符號舒帮,進行分類会喝,這樣搜索符號也就更加方便。
定義 (Definition) 和實現 (implementation) 跳轉
符號跳轉依托于語言插件對代碼的分析玩郊,已經算得上具備一定的智能特性肢执,但是它還是不夠精確。比如說我們看到某個函數的調用译红,想要知道這個函數的接口定義是什么樣的预茄,它的實現細節(jié)是什么樣的,光靠符號跳轉侦厚,還是會不方便耻陕。我們需要的是直接跳轉到定義和實現的位置,Java 程序員看到這里一定會深有感觸刨沦。
當然诗宣,這個功能也需要語言本身的支持。比如說當你在使用 TypeScript 時想诅,按下 F12梧田,就可以跳轉到函數的定義處淳蔼。
也可以按下 “Cmd + F12” ,跳轉到函數的實現的位置裁眯。
而在書寫 JavaScript 時鹉梨,因為并沒有接口(interface)的概念,定義和實現恰好是相同的穿稳。
引用 (Reference) 跳轉
很多時候存皂,除了要知道一個函數或者類的定義和實現以外,你可能還希望知道它們被誰引用了逢艘,以及在哪里被引用了旦袋。這時你只需要將光標移動到函數或者類上面,然后按下 “Shift + F12”它改,VS Code 就會打開一個引用列表和一個內嵌的編輯器疤孕。在這個引用列表里,你選中某個引用央拖,VS Code 就會把這個引用附近的代碼展示在這個內嵌的編輯器里祭阀。
6. 玩轉鼠標操作
文本選擇
在 VS Code 中,你單擊鼠標左鍵就可以把光標移動到相應的位置鲜戒。而雙擊鼠標左鍵专控,則會將當前光標下的單詞選中。連續(xù)三次按下鼠標左鍵遏餐,則會選中當前這一行代碼伦腐。最后是連續(xù)四次按下鼠標左鍵,則會選中整個文檔失都。
單擊行號柏蘑,就能夠直接選中這一行。如果你在某個行號上按下鼠標粹庞,然后上下移動辩越,則能夠選中多行代碼。
文本編輯
剪切 + 粘貼:拖拽選中的文本
復制 + 粘貼:拖拽選中的文本信粮,在松開鼠標左鍵前按下option鍵即可
多光標
按住 Option 鍵黔攒,然后哪里需要點哪里。
懸停提示窗口
當鼠標移動到某些文本上之后强缘,稍待片刻就能看到一個懸停提示窗口督惰。這個窗口里會顯示跟鼠標下文本相關的信息。
如果我們把鼠標移動到一個函數上面時旅掂,按下 Cmd 鍵 赏胚,則能夠在懸停提示窗口里直接看到該函數的實現。
在 JavaScript 或者 Java 這樣的編程語言中商虐,當我們把鼠標移動到某個變量上時觉阅,我們能夠看到這個變量的定義信息崖疤。而在 CSS 中,當我們把鼠標移動到一個 CSS 規(guī)則上時典勇,我們能看到的則是一段能夠讓這個 CSS 規(guī)則生效的 HTML 的樣例代碼劫哼。
代碼跳轉和鏈接
把鼠標移動到函數上萝映,然后按下 Cmd 鍵哼勇,這時候 函數下面出現了一個下劃線蒙畴。然后當我們按下鼠標左鍵梦碗,就跳轉到了函數的定義處。
當我們在編寫 Markdown 這樣的非編程語言的文檔時聘裁,也可以通過 Cmd + 鼠標左鍵
來打開超級鏈接担锤。