首页
/
每日頭條
/
職場
/
如何做一個vscode插件
如何做一個vscode插件
更新时间:2024-05-06 01:08:08

文章每周持續更新,原創不易,「三連」讓更多人看到是對我最大的肯定。可以微信搜索公衆号「 後端技術學堂 」第一時間閱讀(一般比博客早更新一到兩篇)

如何做一個vscode插件(13個程序員不可不知的VSCode插件)1

大家好我是lemon, 馬上進入我們今天的主題吧。

又見VsCode

Visual Studio Code(簡稱VS Code)是一個由微軟開發,同時支持Windows 、Linux 和 macOS 等操作系統的免費代碼編輯器,在2019年的Stack Overflow組織的開發者調研中,VS Code被認為是最受開發者歡迎的開發環境。

之前寫過一篇文章詳細介紹如何使用 VsCode 進行遠程開發,VsCode 遠程開發環境相對其他 IDE 的遠程開發環境,實現了真正的遠程開發,在本地主機(一般是Windows或MAC)上的操作的對象直接就是遠程機(Linux),所有本地主機上的修改直接基于遠端文件,擺脫了傳統開發流程在本地編輯文件,利用FTP工具上傳到遠程編譯機調試編譯,這一套繁瑣的操作,因此非常的方便。

那篇文章得到了各位讀者的廣泛好評,也被各大号轉載 15 次之多,感興趣的朋友看我原來這篇文章: 手把手教你配置VS Code遠程開發工具,工作效率提升N倍。

這篇文章我會結合日常工作使用經驗,教你打造一個體驗流暢的 C/C 開發環境,這份配置指南可能不是面面俱到,也不會詳細的教你一步步怎麼配置插件,這些太細節的工作留給你自己去完成,實際上插件下載頁都會有詳細的說明。

不少新手可能會覺得 VsCode 編輯文本還好,看代碼和寫代碼太難用,那是沒有掌握正确的打開方式,VsCode 精髓是豐富的插件體系支持,相信看完這篇文章配置好環境之後,就隻剩一句「真香」能形容

如何做一個vscode插件(13個程序員不可不知的VSCode插件)2

為了有個直觀的印象,先來看下我的 VsCode 插件列表,因為我用VsCode 開發 C/C /Go/Python 程序,插件比較多,有些可能和本文無關的插件可以忽略掉。

如何做一個vscode插件(13個程序員不可不知的VSCode插件)3

基礎開發插件

既然是配置支持C/C 環境下開發,那首先推薦的基礎 C/C 開發插件,以下兩個是必須要裝的插件,主要提供一些基礎的代碼調試和查看功能,安裝以後 VsCode 就能支持智能化代碼補全、類型填充和聯想、符号和函數定義跳轉、引用查找等 C/C 程序開發和源碼管理必備能力,讓你的 VsCode 從編輯器進化成 IDE 的基礎插件。

如何做一個vscode插件(13個程序員不可不知的VSCode插件)4

如何做一個vscode插件(13個程序員不可不知的VSCode插件)5

源碼閱讀

程序員日常工作有兩大内容,一個是寫自己的代碼,一個是閱讀别人寫的代碼,下面這兩個插件讓你在 VsCode 優雅看代碼。

首先推薦的是下面的這個懶人神器 TODO Tree,自己寫的 TODO 哭着也要補充實現。

如何做一個vscode插件(13個程序員不可不知的VSCode插件)6

這個插件的使用場景是,你看完代碼加了下面這個注釋 :// TODO 以後會擴展這部分功能 當然,不知道這個「以後」是什麼時候,一不小心以後變成遙遙無期,一部分原因是不想改,另一部分原因是寫下這段注釋的人時間久了就忘記了,這時候你需要「 TODO Tree 插件」,我們可以更方便的管理代碼中的此類注釋。

這個插件能幫你組織和管理TODO 注釋,你在代碼中注釋的帶 TODO 的标簽會統一在側邊欄顯示出來,當然不限于 TODO 注釋,可以自定義管理标簽比如 FIXME 等,可以基于标簽過濾和篩選。

另一個推薦的源碼閱讀插件是 Bookmarks

如何做一個vscode插件(13個程序員不可不知的VSCode插件)7

「書簽」這個插件的功能就和它名字一樣直接,沒錯它就是一個你的源碼書簽,當我們看大工程源碼的時候,往往需要在成千上萬個源文件之間跳轉,此時 Bookmarks 能幫你方便的創建和管理書簽,看到哪個位置想加個書簽就按快捷鍵 Ctrl Alt K ,多按一次就是删除,不僅如此他還提供了在書簽之前跳躍和查看管理的功能,更多功能可以自己體驗,反正我看大工程源碼用這個很爽。

如何做一個vscode插件(13個程序員不可不知的VSCode插件)8

代碼管理

下面介紹兩個 Git 版本控制相關的插件,項目中我們用的最多的版本控制工具是 Git ,當然 VsCode 自身提供了比較豐富的 Git 版本控制功能,基本上可以通過在界面點點點完成一些了Git 操作,但我今天要介紹的這兩個插件能讓你的 Git 更驚豔,算是對功能的增強,讓你的 Git 操作更直觀好用,好看的東西誰不喜歡呢?

第一個出場的是Git Graph 插件,可視化Git倉庫,讓你的提交記錄看起來美觀大方,并且基于圖中提交點提供了豐富的Git 操作。

如何做一個vscode插件(13個程序員不可不知的VSCode插件)9

如圖中你所見到的樣子,提交記錄變成一條條時間線,分支也能清晰的用不同顔色時間線區分出來,并且點開提交線上的提交點可以查看當時的提交動作,可以在提交動作上查看做了哪些改動,也可以方便的跳轉到改動文件,更多功能自行體驗,這個插件 lemon 強烈推薦!

下面介紹的這個GitLens 插件也是Git功能增強工具。

如何做一個vscode插件(13個程序員不可不知的VSCode插件)10

我最喜歡它的一個功能是,它可以在文件中改動的位置後面直接顯示出本次改動的提交信息,然後你可以直接通過顯示的提交信息跳轉到提交文件對比,其實還有其他豐富的功能,不過這個功能我用的最多。

小而美的工具

下面這幾個插件是我在日常使用中積累的工具插件,非必須,但是擁有了之後編碼幸福感倍增,下面一一介紹給大家。

第一個是下面這個Bracket Pair Colorizer插件,我管它叫彩虹括号插件。

如何做一個vscode插件(13個程序員不可不知的VSCode插件)11

你是否為經常為寫的大括号、花括号、小括号沒有匹配而煩惱?是否經常找匹配括号看瞎了眼?現在不要 888 也不要 998,隻需一鍵下載安裝這個插件就再也不用擔心啦。這個插件讓你寫的每一個括号都能找到他自己的顔色,成雙成對,點一下其中一半括号自動匹配另一半,拯救了廣大程序員的近視眼睛度數。

再來介紹下面這個koroFileHeader插件,這個插件主要用于自動的插入頭文件開頭的說明和函數的說明。

如何做一個vscode插件(13個程序員不可不知的VSCode插件)12

比如我們經常看到别人的頭文件開頭是這樣的模闆:

/****************************************************************************** * FILENAME: niu_bi_head_file.h * DESCRIPTION: 非常厲害的頭文件 * HISTORY: Date Author Comment * 2020/09/05 lemon *******************************************************************************/ 123456

這個可不是别人一個個字打出來的,安裝插件之後你隻需要簡單配置想要的格式,然後按下快捷鍵Ctrl Alt i 即可自動即可自動生成這樣一個模闆。

類似的對函數的說明注釋模闆,隻需按下快捷鍵Ctrl Alt t 即可完成,非常的方便。

下面這個插件Switcher,這個插件能在頭文件和 C/C 文件之間跳轉。

如何做一個vscode插件(13個程序員不可不知的VSCode插件)13

這個插件完全是因為我太懶想省力,才找的一個輔助工具,我們經常需要通過頭文件跳到對應的源文件,或者從源文件跳轉到對應的頭文件,當然可以在側邊欄的文件管理器中選擇打開,但是多了一個步驟有點繁瑣,所以我找了這個插件,其實按插件的說明文檔,它是能在不同的文件類型之間跳轉,不僅僅局限于頭文件和源文件,懶人福音,你值得擁有。

實用工具

下面這幾個插件是比較實用的工具插件,各取所需。

第一個是官方提供的 VsCode 中文漢化包。雖然lemon提倡并鼓勵大家多多實用英語,但若你不想折騰,那咱們家漢語博大精深,好優美的中國話,那就讓VsCode也來說漢語吧,Microsoft 官方直供,兼容性好,放心食用。

如何做一個vscode插件(13個程序員不可不知的VSCode插件)14

下面這個是 Markdown 預覽增強插件。對于經常寫博客或文章的人來說,Markdown 肯定是少不了的,這個插件支持分屏預覽,各種豐富的Markdwon 增強功能。

如何做一個vscode插件(13個程序員不可不知的VSCode插件)15

最後這個 shellman 插件是 Linux shell 腳本輔助工具。在 Linux 下工作難免随手寫一個腳本,這個插件能提供了便捷的shell script 自動補全和聯想等功能,提高你的腳本編寫速度和準确性。

如何做一個vscode插件(13個程序員不可不知的VSCode插件)16

最常用快捷鍵

快捷鍵太多,沒必要完全記下來,隻需記住一些常用的快捷鍵即可,一些不常用的快捷鍵在使用的時候加強記憶就好。列舉出我自己常用的快捷鍵,不多,但夠用!應付日常開發工作綽綽有餘。

Ctrl Shift P 這個必須要放在第一位,這個命令是所有「命令之母」。這麼說一點也不過分,它會打開 VsCode 命令窗口,在這個窗口下輸入上述的插件名稱就能知道這個插件支持哪些特性了,順帶還會說明特性快捷鍵。

下面舉個例子,先輸入Ctrl Shift P 打開命令查找輸入框,然後輸入 bookmarks 就能知道這個插件的支持的所有特性,順便記下快捷鍵。

如何做一個vscode插件(13個程序員不可不知的VSCode插件)17

Ctrl P 文件查找。快速打開文件列表,輸入關鍵字匹配文件,優先顯示最新打開過的文件,方便的在指定文件之間跳轉。

F12 跳轉到定義,這個沒啥好說的,跳轉到函數或符号的定義,這是高頻操作。

Alt F12 以預覽方式在當前頁面顯示定義,都是查看定義,相對 F12 的優點是不會跳出當前文件到定義文件,而是在當前文件打開一個小窗口預覽,如下圖:

如何做一個vscode插件(13個程序員不可不知的VSCode插件)18

Shift F12 查看光标所在函數或變量的引用,就像 Alt F12 一樣以預覽方式在當前文件打開引用的文件列表。如下圖:

如何做一個vscode插件(13個程序員不可不知的VSCode插件)19

Alt 左/右箭頭 前進或者後退到光标所在源碼的上一個位置。

Ctrl Shift O 查看當前文件的符号,可以用關鍵字過濾符号,當然你也可以在左側的大綱視圖中查找符号,不過大綱視圖不能查找匹配符号,所以我更習慣用快捷鍵方式查找符号。

如何做一個vscode插件(13個程序員不可不知的VSCode插件)20

快捷鍵講完了嗎?沒有,太多快捷鍵了;其他的快捷鍵不重要嗎?因人而異吧,高頻使用的快捷鍵就是重要的,而上面我說的這幾個是超高頻使用,記住這幾個差不多就行了,剩下快捷鍵你如果用的多了自然就記住了,但是我說的這幾個請務必先記在腦子裡,這會大大降低你的使用成本,盡早享受 VsCode Coding 的樂趣!

最後說幾句

想起我上大學的時候,大一學習C語言課必須安裝VC 6.0才行,那時候也有 Visual studio 這樣的 IDE,不過老師沒推薦其他 IDE,都是憑借自己對編程的興趣發現了更多比VC 6.0 更加 ‘現代化’ 的 IDE,比如Jetbrain 系列和Visual studio系列,愛不釋手各種嘗試。

如何做一個vscode插件(13個程序員不可不知的VSCode插件)21

現在主流的 IDE 已經非常豐富,其實編輯器或者 IDE 隻是一個工具,沒有最好自己用的順手就行,就像 Vim 黨和 Emacs 黨誰也說服不了誰一樣,有的人喜歡。

大家更應該關注編程這件事本身,提高自身硬實力才是最緊要的,不過好的工具能讓你事半功倍,這點 lemon 也是完全贊成的,希望這篇文章也能夠讓你事半功倍。

我是lemon,熱愛技術,也愛生活,堅持分享輸出,讓自己和讀者都有收獲!關注我來跟我一起變強吧。

如果覺得文章寫的還行,對你有所幫助,動動手指「點贊」或給「轉發」是對我持續創作的最大支持。

如何做一個vscode插件(13個程序員不可不知的VSCode插件)22

文章每周持續更新,可以微信搜索公衆号「 後端技術學堂 」提前看,點擊下方了解更多查看原文,我們下期見!

如何做一個vscode插件(13個程序員不可不知的VSCode插件)23

,
Comments
Welcome to tft每日頭條 comments! Please keep conversations courteous and on-topic. To fosterproductive and respectful conversations, you may see comments from our Community Managers.
Sign up to post
Sort by
Show More Comments
推荐阅读
熱門工作技能
熱門工作技能
根據媒體報道,人社部發布《中華人民共和國職業分類大典(2022年版)》“火鍋料理師(hotpotchef)”成為中式烹調師職業下的新工種。火鍋料理師?這是什麼?根據官方定義,火鍋料理師是指從事火鍋鍋底、醬料、蘸料、菜肴預制、菜品切配并具備一...
2024-05-06
公司體檢一般檢查哪些項目女性
公司體檢一般檢查哪些項目女性
我們每次看到相關的體檢項目,都會一個頭兩個大。體檢項目衆多,五花八門,很多項目還具有針對性,如何選擇是個大學問。特别是女性員工,我們看到很多項目上有寫未婚和已婚,搞混了就特别尴尬。下面我們一起來了解女性員工要選擇哪些體檢項目,以及檢前注意事...
2024-05-06
内退職工享受漲工資嗎
内退職工享受漲工資嗎
#内退對以後的工資和工齡有影響嗎##今日話題#約克老師帶大家首先看一看“内退”是什麼?内退,一般被叫做企業的外部退養,是企業對老年職工的一種安頓辦法。首先闡明一點,在崗時領的是“工資”、内退之後領的則是“生活費”。由于有人叫習氣了,所以也...
2024-05-06
立式打包機原理圖
立式打包機原理圖
第一步:将已充電的電池安裝到手持式打包機上,将PP或PET打包帶從下到上纏繞到貨物上,用左手握住打包帶,使下層的打包帶尾端離手約20厘米;第二步:右手握住打包機,拉緊進帶控制杆,使打包帶完全放入打包機内,打包帶的前端伸出打包機外約5cm。然...
2024-05-06
怎樣選擇一個好的職業技術學校
怎樣選擇一個好的職業技術學校
怎樣選擇一個好的職業技術學校?曆史悠久這個學校如果創立的時間很早,而且經曆了這麼多年的風風雨雨,依然屹立不倒的話,說明這個學校的實力還是可以的,值得我們考慮,今天小編就來說說關于怎樣選擇一個好的職業技術學校?下面更多詳細答案一起來看看吧!怎...
2024-05-06
Copyright 2023-2024 - www.tftnews.com All Rights Reserved