VSCode: 拡張機能開発

概要

この記事では Visual Studio Code (vscode) の拡張機能の作成方法について説明する。拡張機能は vscode の機能を拡張するための小さなプログラムで、vscode の拡張機能エディタを使用して JavaScript または TypeScript で記述することができる。

Table of Contents

1. 概要
2. 開発手順
3. 参照

開発手順

拡張機能の開発手順は公式サイト [1] に記載されている。Node.js と git がインストールされている環境で Yeoman と VSCode Extension Generator をインストールし、拡張機能の雛形を生成する。

$ npm install -g yo generator-code

npm WARN deprecated debuglog@1.0.1: Package no longer supported. Contact Support at https://www.npmjs.com/support for more info.
npm WARN deprecated readdir-scoped-modules@1.1.0: This functionality has been moved to @npmcli/fs
npm WARN deprecated @npmcli/move-file@1.1.2: This functionality has been moved to @npmcli/fs
npm WARN deprecated @npmcli/move-file@2.0.1: This functionality has been moved to @npmcli/fs

added 1089 packages in 40s

97 packages are looking for funding
  run `npm fund` for details

$ yo code

     _-----_     ╭──────────────────────────╮
    |       |    │   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 (JavaScript)
? What's the name of your extension? vscode-gamepad-debug
? What's the identifier of your extension? vscode-gamepad-debug
? What's the description of your extension? A vscode extension to allow debugging runs using you gamepad.
? Enable JavaScript type checking in 'jsconfig.json'? Yes
? Initialize a git repository? Yes
? Which package manager to use? npm

Writing in C:\Users\torao\git\vscode-gamepad-debug...
   create vscode-gamepad-debug\.vscode\extensions.json
   ...

Changes to package.json were detected.

参照

1. Visual Studio Code: Your First Extension