Zenn
Open4

VSCode 拡張機能開発について

VS Code
yg_siroyg_siro

設定ファイルについて

拡張機能のユーザー設定を使用する方法。
詳細はWorkspaceConfigurationを確認する事。

package.json

contributes->configuration内に色々記載する。
【】の部分を拡張機能に合わせて修正する。

"contributes": {
  "configuration":{
    "title": "【VS Codeの設定に表示したいタイトル】",
    "properties": {
    "【モジュール名】.【設定名】":{
      "type": "【設定の型（string, boolean, numberなど)】",
      "description": "【概要】",
      "default": "【デフォルト値】"
				}
			}
		}
	},

typescript

【モジュール名】と【設定名】、【設定の型】はpackage.jsonに記載した名前と一致させる事

const config = vscode.workspace.getConfiguration('【モジュール名】');
const result = config.get<【設定の型】>('【設定名】');
yg_siroyg_siro

ファイルの保存時になにかしたい

vscode.workspace.onWillSaveTextDocumentイベントを使用する。

TextDocumentWillSaveEventから保存する前のdocument: TextDocumentが取得できるので保存前の作業が可能になる。

extension.ts
export function activate(context: vscode.ExtensionContext) {
	vscode.workspace.onWillSaveTextDocument(event => {
		//event: TextDocumentWillSaveEvent
		const document = event.document;
	}, null, context.subscriptions);
}

設定ファイルでon/offを切り替えれるようにpackage.jsonで設定したほうがいいかも。

yg_siroyg_siro

package.json

package.jsonのフィールドの説明

name

  • Required: yes
  • Type: string
  • Example: wordcount

拡張機能の名前。空白は禁止で全て小文字にする必要があります。

version

  • Required: yes
  • Type: string
  • Example: 1.0.0

SemVerと互換性のあるバージョン。

publisher

  • Required: yes
  • Type: string
  • Example: ygsiro

この拡張機能を発行した人の名前です。

engines

  • Required: yes
  • Type: object
  • Example: ^0.10.5

この拡張機能を使用する場合に必要なVSCodeの最低バージョン。
^0.10.5とした場合、少なくともVSCodeのバージョン0.10.5以上である必要があります。

license

  • Required: no
  • Type: string
  • Example
    • "BSD-3-Clause"
    • "SEE LICENSE IN LICENSE.md"

LICENSEファイルがある場合は"SEE LICENSE IN <filename>"のように記載する。
ない場合は直接ライセンスを記載する。

displayName

  • Required: no
  • Type: string
  • Example: Word Count

マーケットプレイスで使用される拡張機能の表示名。

description

  • Required: no
  • Type: string
  • Example: "Markdown Word Count Example - reports out the number of words in a Markdown file."

拡張機能の簡単な説明

categories

  • Required: no
  • Type: string[]
  • Allowed values
    • Programming
    • Languages
    • Snippets
    • Linters
    • Themes
    • Debuggers
    • Formatters
    • Keymaps
    • SCM Providers
    • Other
    • Extension Packs
    • Data Science
    • Machine Leraning
    • Visualization
    • Notebooks
    • Education

拡張機能のカテゴリを上記のリストから選択する。複数選択してもよい。

keywords

  • Required: no
  • Type: array

拡張機能を見つけやすくする為のキーワード。
最大５つまでに制限されています。

galleryBanner

  • Required: no
  • Type: object

調査中

preview

  • Required: no
  • Type: boolean
  • Example: true

マーケットプレイスでpreviewと表示するか？

main

  • Required: no
  • Type: string

調査中

browser

  • Required: no
  • Type: string

調査中

contributes

  • Required: no
  • Type: object

調査中

activationEvents

  • Required: no
  • Type: array

調査中

badges

  • Required: no
  • Type: array

調査中

markdown

  • Required: no
  • Type: string
  • Allowed values
    • github(default)
    • standard

Markdownレンダリングエンジンを指定する。
デフォルトはgithub

qna

  • Required: no
  • Allowed values
    • marketplace(default)
    • string
    • false

Q&Aリンクを制御します。
marketplaceの場合、マーケットプレイスにQ&Aを表示します。
Q&AサイトのURLを記載するか、falseにしてQ&Aを無効にする事ができます。

dependencies

  • Required: no
  • Type: object

拡張機能が必要とするランタイムのNode.jsの依存関係。

devDependencies

  • Required: no
  • Type: object

拡張機能に必要なNode.jsの依存関係。

extensionPack

  • Required: no
  • Type: array
  • Example: vscode.csharp

この拡張機能にバンドルされている拡張機能の ID を含む配列です。
これらの他の拡張機能は、この拡張機能がインストールされたときに一緒にインストールされます。
拡張機能のIDは常に${publisher}.${name}です。

extensionDependencies

  • Required: no
  • Type: array
  • Example: vscode.csharp

この拡張機能が依存している拡張機能の ID を含む配列です。
これらの他の拡張機能は、この拡張機能がインストールされたときに一緒にインストールされます。
拡張機能のIDは常に${publisher}.${name}です。

extensionKind

  • Required: no
  • Type: array
  • Example: ["ui", "workspace"]

リモート構成で拡張機能を実行する場所を示す配列です。
値は ui (ローカルで実行), workspace (リモートマシンで実行), あるいはその両方で、優先順位はその順になります。

["ui", "workspace"]の場合、ローカルでもリモートでも実行可能ですがローカルで実行を望みます。

scripts

  • Required: no
  • Type: object

npmのスクリプトと全く同じですが、vscode:prepublishやvscode:uninstallなど、VS Code特有のフィールドが追加されています。

icon

  • Required: no
  • Type: string

アイコンファイルへのパス。
アイコンの大きさは少なくとも128x128ピクセル（Retina画面の場合は256x256）