首頁 > 軟體

好用的VSCode頭部註釋外掛Fileheader Pro

2022-07-14 14:02:49

動機

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

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

這段程式碼來自這裡

安裝與使用

如何獲得它

讓它默默新增頭部註釋

檔案註釋中的資訊來自於您的版本控制工具,目前外掛還只支援Git,再未來它將支援SVN,Mercurial等其它版本控制工具。 因此請您確保在有Git的專案中使用它。

安裝後,預設的模板將能複合大部分的使用場景。

當你新建一個檔案後,將會自動地為你新增Fileheader。因此大部分情況下您不需要下文中的手動新增

如您需要手動新增到已有程式碼,開啟一個檔案後,在您的命令面板裡【您可以使用Ctrl(Mac下是Command) + Shift + P】,輸入 Fileheader Pro: Add Fileheader並按下回車,就能見到檔案註釋恰如其分地加入到了您巧奪天工的程式碼頭部。

儲存時,您的檔案頭部註釋需要更新時,Fileheader Pro將會自動為您更新。

自定義模板

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

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

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

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

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

可以使用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原始碼本身就使用了自定義模板新增頭部註釋。

所以它也是一個例子

fileheader-pro/fileheader.template.js at main · IronLu233/fileheader-pro (github.com)

設定項

FileheaderPro.disableFileds

對於預設的模板,其中的各個欄位都可以通過它來禁用。禁用的欄位將不會出現在註釋之中。 您可以在VSCode的設定介面中,對其進行修改

預設值是['mtime']。不建議啟用mtime。因為當一個檔案被多個人修改時,他們關於mtime的註釋,會在程式碼合併時造成衝突!

FileheaderPro.companyName

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

FileheaderPro.currentUserName和FileheaderPro.currentUserEmail

這兩個欄位可以直接覆蓋掉模板中的userNameuserEmail變數,也會間接影響authorNameauthorEmail(當檔案並未被版本控制工具追蹤的時候)

FileheaderPro.dateFormat

註釋中的日期的格式。請參考:momentjs.com/docs/#/disp…

FileheaderPro.autoInsertOnCreateFile

是否啟用建立檔案時,自動新增檔案頭部註釋。預設它是開啟的

FileheaderPro.autoUpdateOnSave

是否儲存時更新fileheader。預設啟用。

Fileheader Pro內部只在需要的時候更新檔案頭部註釋。

Q & A

它是怎麼實現的?

使用了ES6的tagged template

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

fileheader-pro/FileheaderLanguageProvider.ts at main · IronLu233/fileheader-pro (github.com)

沒有我支援的語言

目前支援這些語言

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

以上就是好用的VSCode頭部註釋外掛Fileheader Pro的詳細內容,更多關於VSCode頭部註釋Fileheader Pro的資料請關注it145.com其它相關文章!


IT145.com E-mail:sddin#qq.com