Microsoft Visual Codeのエクステンションを作成してみた
概要
@ITの記事、 特集：Visual Studio Code早分かりガイド：Visual Studio Codeのエクステンションを作成する (1/2) - ＠ITを参考にして、Microsoft Visual Codeのエクステンションを作成してみました。
エクステンション作成手順
ひな形を作成する
extension generatorをインストールする。
$ npm install -g yo generator-code
$ yo code
入力の一例
| 質問項目 | 値 |
|---|---|
| Extension Type | TypeScript(default) |
| エクステンションの名前 | hello |
| エクステンション識別子 | hello |
| エクステンションの説明 | This is a hello world. |
| 発行者 | unokun |
実行する
1) エクステンション作成したフォルダでVisual Codeを起動する。$ code .
2) エクステンションを実行する
Shift+Command+Pでエクステンションを実行する。
メッセージボックスが表示される。
機能を修正する
選択した領域の字数を表示するように修正する。
var editor = vscode.window.activeTextEditor;
if (!editor) {
return;
}
var selection = editor.selection;
var text = editor.document.getText(selection);
vscode.window.showInformationMessage('selected characers: ' + text.length);
Command+R(MacOS)でエクステンションを再読み込みする。
エクステンションを再実行する
テキストを入力し、範囲選択する。Shift+Command+Pでエクステンションを実行する。
選択されているテキストの文字数がメッセージボックスに表示される。
さらに機能を拡張する
このページの最後、Next Stepsを参考にして進める。
