スニペットガイド

contributes.snippets コントリビューションポイントを使用すると、スニペットを Visual Studio Code 拡張機能にバンドルして共有できます。

スニペットの作成に関するトピックには、スニペットを作成するためのすべての情報が含まれています。このガイド/サンプルでは、独自のスニペットを共有するための拡張機能に変える方法のみを示します。推奨されるワークフローは次のとおりです。

• Snippets: Configure User Snippets コマンドを使用してスニペットを作成し、テストします。
• スニペットに満足したら、JSON ファイル全体を拡張機能フォルダー (例: snippets.json) にコピーします。
• package.json に以下のスニペットコントリビューションを追加します。

{
  "contributes": {
    "snippets": [
      {
        "language": "javascript",
        "path": "./snippets.json"
      }
    ]
  }
}

ヒント: package.json 内の以下の設定で、拡張機能をスニペット拡張機能としてタグ付けします。

{
  "categories": ["Snippets"]
}

完全なソースコードは以下で確認できます: https://github.com/microsoft/vscode-extension-samples/tree/main/snippet-sample。

TextMate スニペットの使用

yo code 拡張機能ジェネレーターを使用して、TextMate スニペット (.tmSnippets) を VS Code のインストールに追加することもできます。このジェネレーターには、New Code Snippets というオプションがあり、複数の .tmSnippets ファイルを含むフォルダーを指定すると、それらが VS Code スニペット拡張機能としてパッケージ化されます。このジェネレーターは、Sublime スニペット (.sublime-snippets) もサポートしています。

最終的なジェネレーターの出力には、2つのファイルがあります。1つは、スニペットを VS Code に統合するためのメタデータを持つ拡張機能マニフェスト package.json で、もう1つは、VS Code スニペット形式に変換されたスニペットを含む snippets.json ファイルです。

.
├── snippets                    // VS Code integration
│   └── snippets.json           // The JSON file w/ the snippets
└── package.json                // extension's manifest

生成されたスニペットフォルダーを .vscode/extensions フォルダーの下の新しいフォルダーにコピーし、VS Code を再起動します。