大家好，今天是第十九天。我們將開始實作一個用滿足現實生活需求的擴充套件，今天會先了解專案必備的功能與需求，以及一些相關背景。

專案緣起

這次鐵人賽我們將做的專案將會跟程式碼片段很有關係，相信大部分的人都使用過了Code Snippet。沒有很熟悉設定也沒關係，接下來的賽程我們會為讀者做說明。

在VSCode裡面，我們可以透過定義snippet物件或安裝擴充套件，在我們打字時產生如上圖的code snippet提示。按下去，一鍵就可以產生事先寫好的程式碼片段，非常方便。

但裝多了snippet套件時會有個問題，snippet套件會指定對應語言。

正常像筆者現在編輯typescript檔案，輸入文字時，VSCode就會跳出提示來跟我們講有什麼程式碼片段可以使用。

筆者現在想在function裡寫個return，打兩個字就跳出react native相關程式碼片段的提示。對正在開發vscode extension的專案，這時用不到react native的片段，跳出來的提示就變成干擾啦。

在VSCode裡面，我們可以到安裝套件的頁面，去指定停用當下workspace下面的套件。

可是啊，筆者可是裝了很多程式碼片段套件啊，讀者可以看到，不光是react的程式碼片段，就連angular的片段再打re的時候也跳出來了，每開一個extension套件就要一個一個套件開開關關，多麻煩啊!

這個時候，如果有個套件針對不同專案類型，而非語言。自動幫我們把不需要的套件關掉，啟動這些套件，不是方便很多嗎？

幸運的是，在VSCode擴充套件裡，這些需求是可以被達成的。

底下就來讓筆者就會介紹此次專案會實現的功能。

CodeManager專案需求介紹

筆者預想的專案功能，有兩大方向。

一是可以讓使用者自定義加入並編輯自己的程式碼片段，根據分類套用至不同專案。
二是可以管理不同extension的套件，讓套件在不需要使用它的專案被禁用

除此之外，專案預計至少實現以下功能：

1. 使用者可讀取程式碼片段工作區的程式碼做管理
2. 可於樹狀選單呈現當前使用者的程式碼片段
3. 可設定個人設定，針對不同專案類型載入特定的code snippet
4. 可於管理介面設定snippet分類
5. 可手動選擇是否載入特定分類的snippet至vscode中
6. 使用者要能選取VSCode裡的文字，並能夠把選中的程式碼加入Code Snippet的儲存區中。
7. 使用者可以選定本地儲存路徑，創建一個工作區放置snippet片段。
8. Extension使用者可以將儲存的snippet片段與Github、Gist同步。
9. 使用者可以於搜尋框查詢儲存過的snippet，並能對其進行編輯修改、刪除。
10. 使用者可以在使用者介面新建一個snippet 片段，指定active的語言等屬性

上是我們規劃的功能。

鐵人賽我們的章節分配會根據上面功能做對應調整，原本規劃的VSCode Snippet實戰、第三方服務整合、測試與發佈篇，均會合併到今天開始的VSCode Extension專案實戰，並在這個專案中做實際練習與說明。VSCode語言服務實戰篇章將視情況增減。

本日結語

本次範例的功能需求是在今天第十九天決定的。

按照原來的規劃，基本介紹一篇，設定相關兩篇，元件相關介紹大約十到十二篇。全部應該十五篇左右，目前全部完成約十八篇，篇章進度延後，現在到完賽我們還有十一篇可以發揮。

其中Webview佔四篇，這個份量我覺得是合理的。Webview需要注意的地方相對比較多，Workspace API少介紹一兩個設定，只需查閱文件去了解如何使用這個設定。但Webview的設定沒有搞清楚，很容易會整個網頁的圖片資源都無法正常顯示，然後開始鬼打牆除錯。

參考前面篇章的經驗，考量到今天規劃的各個功能，筆者會調整章節分配，希望讀者在練習中有收穫，並體驗實際解決現實生活問題的感受。

我們明天見，謝謝大家。

2020.10.20: 最近似乎有人在洗這個系列的文章數，各篇文章的點閱率會莫名的呈現同一個閱讀數，以今天10.20上午筆者看到的狀況為例，各篇點閱率都被洗到126，這裡做個紀錄。