點擊右邊

使吃角子老虎機 英文用VSCode 創立一個插件

VSCode 創立一個插件,若何創立一個插件,VS Code 的插件既然是一個 Node.js 運用,那末民間天然也會供應了基于 NPM 的對象鏈來輔助你創立以及維護插件。
起首你必要的是 yeoman,一個腳手架對象。經由過程 yeoman 你可以疾速創立代碼模板,以下所示:

npm install -g yeoman

然后你必要裝置 VS Code 的模板:

npm install -g generator-code

有了腳手架,你就可以創立一個 VS Code 的插件模板了。接上去運轉:

yo code myextension

請注重,第三個參數將是你新創立的插件的文件夾名字。

由上圖,你可以望到有七個插件模板:

前兩個是經由過程編程來供應插件功效,你可以選擇 TypeScript 或者者 JavaScript,效果都是相似的,由于 TypeScript 最初也必要被編譯成 JavaScript 再發布;第三個是主題插件,你可以將你本人創立的主題分享給其余人;第四個是說話支撐,也便是語法高亮、說話界說等;第五個是代碼片斷的分享;第六個則是分享快捷鍵;第七個便是對多個插件進行組合分享。

對于主題(Color Theme)、快捷鍵(Keymap)、代碼片斷(Code Snippet)的分享,我會鄙人一講進行先容。說話支撐以后也會觸及。本日,咱們先講述第二個選項 “New Extension (JavaScript)”。

接上去,你會依次被提醒輸出插件的名字、先容、想要用哪一個賬號發布、是否要關上 type check和是否要使用 git 等。你可以暫時按照我的樣例進行輸出,以后也能夠再依據必要點竄。

輸出掃數成績后,劇本就會主動地創立文件,裝置必要的 dependencies。掃數收場后,劇本會提醒你,可以運轉上面的劇本關上這個插件的代碼。

cd myextension code .

VS Code 的腳手架,默許為咱們創立了不少的文件。無非像 .gitignore、.eslintrc.json、README.md 這些文件的作用想必你已經經比較認識了。關于這個插件而言,最緊張的是上面幾個文件:

package.json 我下面提到了,VS Code 的插件便是一個 Node.js 的運用,package.json 里記載了這個 Node.js 運用的信息。同時,插件的信息也會被記載在這個文件內。 extension.js 這個文件是當前插件的掃數代碼。 .vscode 腳手架對象已經經為咱們供應了調試設置、使命設置等,有了它們,咱們就不消本人花時間謄寫了。

好了,上面咱們來望望 extension.js 以及 package.json。望完它們,你就對 VS Code 插件是若何運轉的有很好的懂得的。

extension.js的內容在刪除了一切的正文后,以下:

const vscode = require(‘vscode’);

function activate(context) {
console.log(‘Congratulations, your extension 公眾myextension公眾 is now active!’);
let disposable = vscode.commands.registerCommand(‘extension.sayHello’, function () {
vscode.window.showInformationMessage(‘Hello World!’);
});
context.subscriptions.push(disposable);
}
exports.activate = activate;

function deactivate() {
}
exports.deactivate = deactivate;

第一,咱們引用了 vscode 這個庫。經由過程引用這個庫,咱們就可以或許使用 VS Code 的插件 API 了。

第二,咱們創立了 activate 函數而且將其輸入。VS Code 的插件過程在激活這個插件時,便是挪用這個被輸入(export)的函數。也便是說,這個函數,便是這個插件的進口。

相對于應的便是 deactivate 函數,當咱們禁用這個插件或者者封閉 VS Code 時,這個函數就會被挪用了。
上面咱們再來望望 activate 這個函數:

function activate(context) {
console.log(‘Congratulations, your extension “大眾myextension公眾大樂透獎金分配 is now active!’財神娛樂城);
let disposable = vscode.commands.registerCommand(‘extension.sayHello’, function () {
vscode.window.showInformationMessage(‘Hello World!’);
});
context.subscriptions.push(disposable);
}`

這個函數起首輸入了 log,奉告咱們插件已經經被勝利激活了。接著,咱們使用 vscode.commands.registerCommand注冊一個名為 extension.sayHello的下令,這個下令的完成,是 registerCommand的第二個參數,咱們經由過程挪用 vscode.window.showInformationMessage ,在界面上調出一個提醒框,內容則是 Hello World!。

無非,光有 extension.js ,這個插件是沒法運轉的。VS Code 會依據前提來激活插件,而這個激活前提寫在了 package.json 中,那末咱們一路來望下package.json。

{
公眾name”大眾: “大眾myextension公眾,
“大眾displayName公眾: “大眾myextension”大眾,
公眾description公眾: “大眾my extension”大眾,
“大眾version”大眾: “大眾0.0.1″大眾,
“大眾publisher公眾: “大眾rebornix”大眾,
“大眾engines公眾: {
“大眾vscode”大眾: 公眾^1.29.0″大眾
},
“大眾categories”大眾: [
公眾Other”大眾
],
“大眾activationEvents”大眾: [
“大眾onCommand:extension.sayHello公眾
],
“大眾main”大眾: “大眾./extension”大眾,
“大眾contributes”大眾: {
“大眾commands公眾: [
{
“大眾command公眾: “大眾extension.sayHello”大眾,
公眾title公眾: “大眾Hello World”大眾
}
]
},
“大眾scripts”大眾: {
“大眾postinstall”大眾: 公眾node ./node_modules/vscode/bin/install”大眾,
“大眾test公眾: “大眾node ./node_modules/vscode/bin/test”大眾
},
“大眾devDependencies”大眾: {
公眾typescript”大眾: “大眾^2.6.1公眾,
“大眾vscode”大眾: 公眾^1.1.21″大眾,
“大眾eslint公眾: 539二三四星連碰多少錢公眾^4.11.0公眾,
“大眾@types/node”大眾: “大眾^8.10.25″大眾,線上麻將朋友
公眾@types/mocha公眾: “大眾^2.2.42″大眾
}
}

下面這個文件,跟平凡的 npm 的 package.json 只有三處不同。

第一處是 engines。

“大眾vscode”大眾: “大眾^1.29.0″大眾

它指定了運轉這個插件必要的 VS Code 版本。譬如 “^1.29.0” 便是申明,要裝置運轉這個插件必需要使用 VS Code 1.29 及以上版本。

第二處是 activationEvents。

公眾activationEvents”大眾: [
“大眾onCommand:extension.sayHello”大眾
]

這個屬性指定了甚么環境下這個插件應當被加載而且激活。在咱們這個例子里,激活前提是,當用戶想要運轉 “extension.sayHello” 這個下令時,就激活這個插件。
這個機制可以或許保障,當咱們必要使用這個插件的時辰,這個插件才被激活,盡量地保障機能以及內存使用的合感性。

第三處是 contributes。

“大眾contributes”大眾: {
“大眾commands公眾: [
{
“大眾command”大眾: “大眾extension.sayHello”大眾,
“大眾title”大眾: “大眾Hello World公眾
}
]
},

這個屬性指定了,咱們這個插件給 VS Code 增添了一個 comm六合彩二星三星and,這個 command 的 id 是 “extension.sayHello”, 跟 extension.js 中寫的同樣。而這個下令的名字,鳴做 Hello World。

若是不寫這個屬性的話,VS Code 是不會把這個下令注冊到下令面板中的,咱們也就無法找到這個下令而且履行了。

【免責聲明】本站內容轉載自互聯網,其相關談吐僅代表作者小我私家概念盡非權勢巨子,不代表本站態度。如您發明內容存在版權成績,請提交相關鏈接至郵箱:,咱們將實時予以處置。