iT邦幫忙

第 12 屆 iThome 鐵人賽

DAY 28
0

大家好,我是韋恩,今天是第二十八天,讓我們會練習獲取extension的api,為專案的重點功能做準備!


Extension API簡介


在vscode的api裡的extensions命名空間底下,有讓我們獲取安裝的第三方extension的api。

讓我們打開vscode,檢查下extensions底下的api。

主要的API有三個

Extensions API 描述
all 唯讀屬性,VSCode安裝的extension的物件陣列
getExtension 給定指定的extensionId,取得對應的extension物件
onDidChange 監聽extension被安裝、卸載、停用、啟用的方法

透過上面的getExtension方法,我們可以拿到指定的extension物件,這裡的extensionId是由我們在extension的package.json裡的name跟publisher兩個屬性組成的,規則如下

${publisher}.${name}

以我們的extension為例,我們可以這樣取得自己的extension物件。

extension物件有以下屬性與方法讓我們使用

Extension物件屬性/方法 描述
id 唯讀屬性,extension的id
isActive 唯讀屬性,VSCode安裝的extension的狀態
packageJSON 唯讀屬性,安裝的extension的package.json設定檔
extensionPath 唯讀屬性,安裝的extension的路徑
extensionUri 唯讀屬性,安裝的extension的VSCode Uri物件,物件底下有path等資訊。
extensionKind 唯讀屬性,extension的類型,用於區分是否為remote的extension。
exports 唯讀屬性,第三方extension exports的api,只能在extension已經active以後取得。
active active獲取的extension的方法,會回傳一個thenable,可以在active結束後取得extension的public api。

我們可以使用active方法啟動獲取的extension,也可以取得extension的相關狀態資訊。

這裡的public api,只的是取得的extension在active function後回傳的物件。

這裡舉一個簡單的例子,當有一個vscode的extension在active function裡回傳了如下物件:

import * as vscode from 'vscode';

export function activate(context: vscode.ExtensionContext) {
   ...
	let count = 0;
	const publicApi = {
		get count() {
			return count;
		},
		minus: () => count + 1,
		plus: () => count -1
	};
	return publicApi;
}

我們的extension在獲取該extension物件後就可以這樣使用這個套件的public api

const extensionApi = vscode.extensions.getExtension('someExtensionId');

extensionApi?.minus();

extensionApi?.plus();

console.log(extensionApi.count);

結語


好的,今天已經了解了怎麼樣拿到第三方的extension,明天我們繼續實作的部分。

我們明天見,掰掰!


上一篇
Day27 | 導入WebviewPanel
下一篇
Day29 | 使用extension動態產生snippet提示吧!
系列文
自己用的工具自己做! 30天玩轉VS Code Extension之旅36
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言