開始使用VSCode

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 +backspacecmd + fn + delete

刪除光標的單詞首:option + delete
刪除光標到單詞尾:option + backspaceoption + 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)建多光標的兩個特別命令

  1. “Cmd + D”
    第一次按下時岭洲,它會選中光標附近的單詞;第二次按下時坎匿,它會找到這個單詞第二次出現的位置盾剩,創(chuàng)建一個新的光標,并且選中它替蔬。
  2. 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 + 鼠標左鍵 來打開超級鏈接担锤。

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
  • 序言:七十年代末被丧,一起剝皮案震驚了整個濱河市乱顾,隨后出現的幾起案子板祝,更是在濱河造成了極大的恐慌,老刑警劉巖走净,帶你破解...
    沈念sama閱讀 219,589評論 6 508
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件券时,死亡現場離奇詭異,居然都是意外死亡温技,警方通過查閱死者的電腦和手機,發(fā)現死者居然都...
    沈念sama閱讀 93,615評論 3 396
  • 文/潘曉璐 我一進店門扭粱,熙熙樓的掌柜王于貴愁眉苦臉地迎上來舵鳞,“玉大人,你說我怎么就攤上這事琢蛤◎讯椋” “怎么了?”我有些...
    開封第一講書人閱讀 165,933評論 0 356
  • 文/不壞的土叔 我叫張陵博其,是天一觀的道長套才。 經常有香客問我,道長慕淡,這世上最難降的妖魔是什么背伴? 我笑而不...
    開封第一講書人閱讀 58,976評論 1 295
  • 正文 為了忘掉前任,我火速辦了婚禮峰髓,結果婚禮上傻寂,老公的妹妹穿的比我還像新娘。我一直安慰自己携兵,他們只是感情好疾掰,可當我...
    茶點故事閱讀 67,999評論 6 393
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著徐紧,像睡著了一般静檬。 火紅的嫁衣襯著肌膚如雪炭懊。 梳的紋絲不亂的頭發(fā)上,一...
    開封第一講書人閱讀 51,775評論 1 307
  • 那天拂檩,我揣著相機與錄音侮腹,去河邊找鬼。 笑死广恢,一個胖子當著我的面吹牛凯旋,可吹牛的內容都是我干的。 我是一名探鬼主播钉迷,決...
    沈念sama閱讀 40,474評論 3 420
  • 文/蒼蘭香墨 我猛地睜開眼至非,長吁一口氣:“原來是場噩夢啊……” “哼!你這毒婦竟也來了糠聪?” 一聲冷哼從身側響起荒椭,我...
    開封第一講書人閱讀 39,359評論 0 276
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎舰蟆,沒想到半個月后趣惠,有當地人在樹林里發(fā)現了一具尸體,經...
    沈念sama閱讀 45,854評論 1 317
  • 正文 獨居荒郊野嶺守林人離奇死亡身害,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內容為張勛視角 年9月15日...
    茶點故事閱讀 38,007評論 3 338
  • 正文 我和宋清朗相戀三年味悄,在試婚紗的時候發(fā)現自己被綠了。 大學時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片塌鸯。...
    茶點故事閱讀 40,146評論 1 351
  • 序言:一個原本活蹦亂跳的男人離奇死亡侍瑟,死狀恐怖,靈堂內的尸體忽然破棺而出丙猬,到底是詐尸還是另有隱情涨颜,我是刑警寧澤,帶...
    沈念sama閱讀 35,826評論 5 346
  • 正文 年R本政府宣布茧球,位于F島的核電站庭瑰,受9級特大地震影響,放射性物質發(fā)生泄漏抢埋。R本人自食惡果不足惜弹灭,卻給世界環(huán)境...
    茶點故事閱讀 41,484評論 3 331
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望揪垄。 院中可真熱鬧鲤屡,春花似錦、人聲如沸福侈。這莊子的主人今日做“春日...
    開封第一講書人閱讀 32,029評論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽肪凛。三九已至堰汉,卻和暖如春辽社,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背翘鸭。 一陣腳步聲響...
    開封第一講書人閱讀 33,153評論 1 272
  • 我被黑心中介騙來泰國打工滴铅, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留,地道東北人就乓。 一個月前我還...
    沈念sama閱讀 48,420評論 3 373
  • 正文 我出身青樓汉匙,卻偏偏與公主長得像,于是被迫代替她去往敵國和親生蚁。 傳聞我的和親對象是個殘疾皇子噩翠,可洞房花燭夜當晚...
    茶點故事閱讀 45,107評論 2 356