VS Codeの拡張について公式ドキュメント読んだメモ
Your First Extension | Visual Studio Code Extension API読んでメモ。
-
Node.jsおよびGitがインストール済みの前提。
-
yomanでgenerator-code使ってプロジェクト作る。
- yomanをローカルにインストールせずとも
npx --package yo --package generator-code -- yo codeで大丈夫。 -
❯ npx --package yo --package generator-code -- yo code Need to install the following packages: yo@5.0.0 generator-code@1.8.5 Ok to proceed? (y) y _-----_ ╭──────────────────────────╮ | | │ Welcome to the Visual │ |--(o)--| │ Studio Code Extension │ `---------´ │ generator! │ ( _´U`_ ) ╰──────────────────────────╯ /___A___\ / | ~ | __'.___.'__ ´ ` |° ´ Y ` ? What type of extension do you want to create? ❯ New Extension (TypeScript) New Extension (JavaScript) New Color Theme New Language Support New Code Snippets New Keymap New Extension Pack New Language Pack (Localization) New Web Extension (TypeScript) New Notebook Renderer (TypeScript) ? What type of extension do you want to create? New Extension (TypeScript) ? What's the name of your extension? vscode-ext-hello ? What's the identifier of your extension? vscode-ext-hello ? What's the description of your extension? hello ? Initialize a git repository? Yes ? Bundle the source code with webpack? Yes ? Which package manager to use? pnpm
- yomanをローカルにインストールせずとも
-
src/extension.tsがエントリーポイント。 -
src/extension.tsを開いて、Debug: Start Debuggingをコマンドパレットで実行。- コンパイルして、拡張機能の開発ホストウィンドウが起動する。
- 開発ホストウィンドウでコマンドパレットを開いて、
Hello Worldを実行すると、Hello World!が表示される。 vscode.window.showInformationMessageでメッセージを表示できる。
-
ブレークポイント貼ってデバッグできる。