分享一個好用的VSCode頭部注釋插件:Fileheader Pro

vscode中怎么快速進行頭部注釋?下面本篇文章給大家分享一個好用的vscode頭部注釋插件:fileheader pro,開箱即用又能完全自定義的fileheader插件您會喜歡么? 總之,非常好用就對了。 添加頭部注釋的事情就交給它吧!

分享一個好用的VSCode頭部注釋插件:Fileheader Pro

【推薦學習:《vscode》】

有時候需要在代碼頭部添加像這樣的一段注釋。這段注釋包括了作者、代碼版權許可等信息。每次重復添加都會讓您覺得非常麻煩。作為開發者的您,時間是自然非常。那么這個插件,就是為這個場景而生,替你無感地默默做完這件事。如果您想要在代碼頭部添加一些類似這樣的ASCII Art。它也能滿足您的需求。

/* ?*?@Author:?IronLu233 ?*?@Date:?2021-03-10?12:00:00 ?*?Copyright???你的公司名字.?All?rights?reserved. ?*/
/* ####?########???#######??##????##?##???????##?????##??#######???#######???#######?? ?##??##?????##?##?????##?###???##?##???????##?????##?##?????##?##?????##?##?????##? ?##??##?????##?##?????##?####??##?##???????##?????##????????##????????##????????##? ?##??########??##?????##?##?##?##?##???????##?????##??#######???#######???#######?? ?##??##???##???##?????##?##??####?##???????##?????##?##???????????????##????????##? ?##??##????##??##?????##?##???###?##???????##?????##?##????????##?????##?##?????##? ####?##?????##??#######??##????##?########??#######??#########??#######???#######??  ?*?@author????????IronLu233?<lrironsora> ?*?@date??????????2022-06-12?22:33:53 ?*/</lrironsora>

這段代碼來自這里:https://github.com/IronLu233/fileheader-pro/blob/main/src/Extension.ts

安裝與使用

如何獲得它

讓它默默添加頭部注釋

文件注釋中的信息來自于您的版本控制工具,目前插件還只支持Git,再未來它將支持svn,Mercurial等其它版本控制工具。 因此請您確保在有Git的項目中使用它。

安裝后,默認的模板將能復合大部分的使用場景。

當你新建一個文件后,將會自動地為你添加Fileheader。因此大部分情況下您不需要下文中的手動添加

分享一個好用的VSCode頭部注釋插件:Fileheader Pro

如您需要手動添加到已有代碼,打開一個文件后,在您的命令面板里【您可以使用Ctrl(Mac下是Command) + Shift + P】,輸入Fileheader Pro: Add Fileheader并按下回車,就能見到文件注釋恰如其分地加入到了您巧奪天工的代碼頭部。

分享一個好用的VSCode頭部注釋插件:Fileheader Pro

保存時,您的文件頭部注釋需要更新時,Fileheader Pro將會自動為您更新。

分享一個好用的VSCode頭部注釋插件:Fileheader Pro

自定義模板

盡管自帶的模板能滿足大部分場景。但自定義模板的強大與整活能力,也值得為它去專門配置。

分享一個好用的VSCode頭部注釋插件:Fileheader Pro

別忘了將你的模板提交到git上,并且讓與你一起開發的同學也安裝Fileheader Pro

首先我們需要創建一個模板。在您VSCode的命令面板中,執行這樣的命令: Fileheader Pro: Generate Custom Fileheader Template;

分享一個好用的VSCode頭部注釋插件:Fileheader Pro

此時在項目的根目錄下的.vscode/fileheader.template.JS。 請修改類CustomLanguageProvider。特別是它的getTemplate方法。它的返回值,就決定了您的文件頭部注釋最后的模樣。另外,languages將會決定,在那些語言的文件中它可以被使用。

請務必將所有返回的字符串使用tpl進行模板字符串函數的調用,否則可能會出現一些奇奇怪怪的問題

分享一個好用的VSCode頭部注釋插件:Fileheader Pro

可以使用variable中的各個字段,對其進行加工處理,放入模板之中。 variables的字段有下列這些

字段 含義
birthtime 文件被創建的時間,如果它被版本控制系統所追蹤那么會從版本控制系統中獲取創建時間,否則將使用文件在磁盤中創建的時間
mtime 文件被修改時間。獲取邏輯同birthime,不建議使用mtime。因為當一個文件被多個人修改時,他們關于mtime的注釋,會在代碼合并時造成沖突!
authorName 作者名字,會從版本控制工具歷史中尋找,如果這個文件是新的,那么它將會使用userName
authorEmail 作者的電子郵箱,回退機制同authorName
userName 用戶的名字。對于git來說,會通過git config user.name獲取
userEmail 用戶的電子郵箱,對于git會通過git config user.email獲取
companyName 公司名稱。沒有公司的可以去工商局登記成立
projectName 當前項目的名稱,也就是就是VSCode所打開的文件夾的名稱
filePath 當前文件的路徑
dirPath 當前文件的目錄路徑
fileName 當前文件的文件名

Fileheader Pro源代碼本身就使用了自定義模板添加頭部注釋。

所以它也是一個例子:

vscode

配置項

FileheaderPro.disableFileds

對于默認的模板,其中的各個字段都可以通過它來禁用。禁用的字段將不會出現在注釋之中。 您可以在VSCode的設置界面中,對其進行修改

默認值是[‘mtime’]。不建議啟用mtime。因為當一個文件被多個人修改時,他們關于mtime的注釋,會在代碼合并時造成沖突!分享一個好用的VSCode頭部注釋插件:Fileheader Pro

FileheaderPro.companyName

您需要在設置中,告訴插件公司的名字,因為無法從任何其它地方得到它!

FileheaderPro.currentUserName和FileheaderPro.currentUserEmail

這兩個字段可以直接覆蓋掉模板中的userName和userEmail變量,也會間接影響authorName和authorEmail(當文件并未被版本控制工具追蹤的時候)

FileheaderPro.dateFormat

注釋中的日期的格式。請參考:https://momentjs.com/docs/#/displaying/format

FileheaderPro.autoInsertOnCreateFile

是否啟用創建文件時,自動添加文件頭部注釋。默認它是開啟的

FileheaderPro.autoUpdateOnSave

是否保存時更新fileheader。默認啟用。

Fileheader Pro內部只在需要的時候更新文件頭部注釋。

Q & A

它是怎么實現的?

使用了es6vscode

我們可以知道哪一些是固定的字符串,哪一些是用戶所使用的變量。接下來請參考這個抽象類

vscode

沒有我支持的語言

目前支持這些語言

  • Javascript
  • Typescript
  • Python
  • HTML
  • CSS
  • Vue
  • Java 請使用自定義模板,或者發起一個vscode。當然,也歡迎提vscode來為Fileheader Pro添磚加瓦

更多關于VSCode的相關知識,請訪問:vscode

? 版權聲明
THE END
喜歡就支持一下吧
點贊15 分享