Snippet-Leitfaden

Der contributes.snippets Contribution Point ermöglicht es Ihnen, Snippets in einer Visual Studio Code-Erweiterung zu bündeln und zu teilen.

Das Thema Erstellen von Snippets enthält alle Informationen zur Erstellung von Snippets. Diese Anleitung / dieses Beispiel zeigt lediglich, wie Sie Ihre eigenen Snippets in eine Erweiterung zum Teilen umwandeln können. Der empfohlene Workflow ist:

• Erstellen und testen Sie Ihre Snippets mit dem Befehl Snippets: Configure User Snippets
• Sobald Sie mit den Snippets zufrieden sind, kopieren Sie die gesamte JSON-Datei in einen Erweiterungsordner, z. B. snippets.json
• Fügen Sie Ihrer package.json den folgenden Snippet-Beitrag hinzu:

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

Tipp: Kennzeichnen Sie Ihre Erweiterung als Snippet-Erweiterung mit der folgenden Konfiguration in Ihrer package.json

{
  "categories": ["Snippets"]
}

Den vollständigen Quellcode finden Sie unter: https://github.com/microsoft/vscode-extension-samples/tree/main/snippet-sample.

Verwendung von TextMate-Snippets

Sie können auch TextMate-Snippets (.tmSnippets) zu Ihrer VS Code-Installation hinzufügen, indem Sie den Erweiterungsgenerator yo code verwenden. Der Generator verfügt über eine Option New Code Snippets, mit der Sie auf einen Ordner mit mehreren .tmSnippets-Dateien verweisen können, die dann zu einer VS Code-Snippet-Erweiterung gepackt werden. Der Generator unterstützt auch Sublime-Snippets (.sublime-snippets).

Die endgültige Ausgabe des Generators enthält zwei Dateien: eine Erweiterungsmanifestdatei package.json, die Metadaten zur Integration der Snippets in VS Code enthält, und eine Datei snippets.json, die die in das VS Code-Snippet-Format konvertierten Snippets enthält.

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

Kopieren Sie den generierten Snippet-Ordner in einen neuen Ordner unter Ihrem .vscode/extensions-Ordner und starten Sie VS Code neu.