ImageOptimizer: Ausführliche Anleitung zum Aktualisieren einer Visual Studio-Erweiterung

In diesem Leitfaden werden anhand der Erweiterung „Image Optimizer“ alle Schritte zum Hinzufügen von Unterstützung für Visual Studio 2022 bei Beibehaltung der Unterstützung für Visual Studio 2019 als Fallstudie beschrieben.
Dieser Leitfaden enthält eine ausführliche Anleitung mit Git-Commit-Links zu jedem Schritt. Den fertiggestellten Pull Request finden Sie unter https://github.com/madskristensen/ImageOptimizer/pull/46.

Weitere Beispiele finden Sie am Ende dieses Leitfadens.

Schritt 1: Modernisieren des Projekts

Weitere Informationen hierzu finden Sie unter Modernisieren Ihres VSIX-Projekts.

Git-Commit e052465

Ändern Sie zunächst auf der Seite „Eigenschaften“ des Projekts die Version des VSIX- und Komponententestprojekts in .NET 4.7.2:

Framework version bump

Image Optimizer enthält Verweise auf einige alte 14.*- und 15.*-Pakete. Installieren Sie stattdessen das NuGet-Paket Microsoft.VisualStudio.Sdk, das alle erforderlichen Verweise konsolidiert.

-  <ItemGroup>
-    <PackageReference Include="Madskristensen.VisualStudio.SDK">
-      <Version>14.0.0-beta4</Version>
-    </PackageReference>
-    <PackageReference Include="Microsoft.VSSDK.BuildTools">
-      <Version>15.8.3247</Version>
-      <IncludeAssets>runtime; build; native; contentfiles; analyzers</IncludeAssets>
-      <PrivateAssets>all</PrivateAssets>
-    </PackageReference>
-  </ItemGroup>

+  <ItemGroup>
+    <PackageReference Include="Microsoft.VisualStudio.SDK">
+      <Version>16.9.31025.194</Version>
+    </PackageReference>
+  </ItemGroup>

Das Projekt wird erfolgreich erstellt, und es werden einige Threadingwarnungen angezeigt. Drücken Sie ctrl und ., um diese Warnungen zu beheben. Fügen Sie die fehlenden Zeilen für den Threadwechsel mithilfe von IntelliSense hinzu.

Schritt 2: Umgestalten des Quellcodes in ein freigegebenes Projekt

Weitere Informationen hierzu finden Sie unter Verwenden von freigegebenen Projekten.

Für Visual Studio 2022 muss ein neues freigegebenes Projekt hinzugefügt werden, das den Quellcode der Erweiterung enthält, der von den VSIX-Projekten in Visual Studio 2019 und Visual Studio 2022 gemeinsam genutzt wird.

  1. Fügen Sie Ihrer Projektmappe ein neues freigegebenes Projekt hinzu.

    Git-Commit abf249d

    Add shared project

  2. Fügen Sie Ihrem VSIX-Projekt einen Verweis auf das freigegebene Projekt hinzu.

    Git-Commit e8e941e

    Add shared project reference

  3. Verschieben Sie Ihre Quellcodedateien (CS, XAML, RESX) in das neue freigegebene Projekt, mit Ausnahme der folgenden:

    • source.extension.vsixmanifest
    • Metadatendateien der Erweiterung (Symbole, Lizenzen, Versionshinweise usw.)
    • VSCT-Dateien
    • Verknüpfte Dateien
    • Externe Tools oder Bibliotheken, die in das VSIX-Projekt eingebunden werden müssen

    Git-Commit f31f051

    Move files to shared project

  4. Verschieben Sie nun alle Metadaten, VSCT-Dateien, verknüpfte Dateien und externe Tools/Bibliotheken an einen freigegebenen Speicherort, und fügen Sie sie dem VSIX-Projekt wieder als verknüpfte Elemente hinzu. Entfernen Sie nichtsource.extension.vsixmanifest.

    Git-Commit 73ba920: Verschieben von Dateien

    Git-Commit d5e36b2: Hinzufügen externer Tools/Bibliotheken

    1. Verschieben Sie für dieses Projekt das Erweiterungssymbol, die VSCT-Datei sowie externe Tools in den neuen Ordner ImageOptimizer\Resources. Kopieren Sie die Elemente in den freigegebenen Ordner, und entfernen Sie sie aus dem VSIX-Projekt.
    2. Fügen Sie die Elemente erneut als verknüpfte Elemente hinzu. Bereits verknüpfte Elemente können beibehalten werden (z. B. Lizenzen).
    3. Überprüfen Sie, ob die Eigenschaft „Buildvorgang“ und weitere Eigenschaften in den hinzugefügten verknüpften Dateien ordnungsgemäß festgelegt sind. Wählen Sie diese hierzu einzeln aus, und überprüfen Sie das Toolfenster „Eigenschaften“. Für unser Projekt mussten wir Folgendes festlegen:
      • Legen Sie den Buildvorgang für icon.png auf Content und die Option „In VSIX einbeziehen“ auf true fest.

      • Legen Sie den Buildvorgang für ImageOptimizer.vsct auf VSCTComplile und die Option „In VSIX einbeziehen“ auf false fest.

      • Legen Sie den Buildvorgang für alle Dateien unter Resources\Tools auf Content und die Option „In VSIX einbeziehen“ auf true fest.

        Add linked files to VSIX project

      • Darüber hinaus stellt ImageOptimizer.cs eine Abhängigkeit von ImageOptimizer.vsct dar. Fügen Sie diese Abhängigkeit der CSPROJ-Datei manuell hinzu:

        - <Content Include="..\SharedFiles\ImageOptimizer.vsct">
        -   <Link>ImageOptimizer.vsct</Link>
        - </Content>
        - <Compile Include="..\SharedFiles\ImageOptimizer.cs">
        -   <Link>ImageOptimizer.cs</Link>
        - </Compile>
        
        + <VSCTCompile Include="..\SharedFiles\ImageOptimizer.vsct">
        +   <ResourceName>Menus.ctmenu</ResourceName>
        +   <Generator>VsctGenerator</Generator>
        +   <LastGenOutput>..\SharedFiles\ImageOptimizer.cs</LastGenOutput>
        + </VSCTCompile>
        + <Compile Include="..\SharedFiles\ImageOptimizer.cs">
        +   <AutoGen>True</AutoGen>
        +   <DesignTime>True</DesignTime>
        +   <DependentUpon>..\SharedFiles\ImageOptimizer.vsct</DependentUpon>
        + </Compile>
        
      • Wenn Sie im Toolfenster „Eigenschaften“ einen bestimmten Buildvorgang nicht festlegen können, können Sie die CSPROJ-Datei wie oben beschrieben manuell ändern und den Buildvorgang nach Bedarf festlegen.

  5. Erstellen Sie das Projekt, um Ihre Änderungen zu überprüfen, und beheben Sie ggf. Fehler/Probleme. Informationen zu häufig auftretenden Problemen finden Sie im Abschnitt Häufig gestellte Fragen.

Schritt 3: Hinzufügen eines Visual Studio 2022-VSIX-Projekts

Weitere Informationen hierzu finden Sie unter Hinzufügen eines Visual Studio 2022-Ziels.

  1. Fügen Sie Ihrer Projektmappe ein neues VSIX-Projekt hinzu.

  2. Entfernen Sie zusätzlichen Quellcode im neuen Projekt mit Ausnahme von source.extension.vsixmanifest..

    Create a new VSIX project

  3. Fügen Sie Ihrem freigegebenen Projekt einen Verweis hinzu.

    Git-Commit dd49cb2

    Add reference to shared project

  4. Fügen Sie die verknüpften Dateien aus Ihrem Visual Studio 2019-VSIX-Projekt hinzu. Vergewissern Sie sich, dass die Eigenschaften „Buildvorgang“ und „In VSIX einbeziehen“ übereinstimmen. Kopieren Sie auch die Datei source.extension.vsixmanifest. Sie werden diese später so ändern, dass sie Visual Studio 2022 unterstützt.

    Git-Commit 98c43ee

    Add Linked files to VSIX project

  5. Ein Buildversuch zeigt, dass ein Verweis auf System.Windows.Forms fehlt. Fügen Sie diesen dem Visual Studio 2022-Projekt hinzu, und erstellen Sie es erneut.

    Git-Commit de71ccd

    + <Reference Include="System.Windows.Forms" />
    
  6. Führen Sie für die Paketverweise Microsoft.VisualStudio.SDK und Microsoft.VSSDK.BuildTools ein Upgrade auf die Visual Studio 2022-Versionen durch.

    Git-Commit d581fc3

    Hinweis

    Bei diesen Versionen handelt es sich um die zum Zeitpunkt der Erstellung dieses Leitfadens aktuellen Versionen. Es wird empfohlen, die jeweils neuesten Versionen herunterzuladen.

    -<PackageReference Include="Microsoft.VisualStudio.SDK" Version="16.0.206" />
    +<PackageReference Include="Microsoft.VisualStudio.SDK" Version="17.0.0-preview-1-31216-1036" />
    -<PackageReference Include="Microsoft.VSSDK.BuildTools" Version="16.10.32" />
    +<PackageReference Include="Microsoft.VSSDK.BuildTools" Version="17.0.63-Visual Studio 2022-g3f11f5ab" />
    
  7. Bearbeiten Sie die Datei source.extension.vsixmanifest so, dass das Ziel Visual Studio 2022 darstellt.

    Git-Commit 9d393c7

    1. Legen Sie das Tag <InstallationTarget> auf Visual Studio 2022 fest, und geben Sie als Nutzlast „amd64“ an:

      <InstallationTarget Id="Microsoft.VisualStudio.Community" Version="[17.0,18.0)">
          <ProductArchitecture>amd64</ProductArchitecture>
      </InstallationTarget>
      
    2. Ändern Sie die Voraussetzung in Visual Studio 2022 und höher:

      - <Prerequisite Id="Microsoft.VisualStudio.Component.CoreEditor" Version="[15.0,)" DisplayName="Visual Studio core editor" />
      + <Prerequisite Id="Microsoft.VisualStudio.Component.CoreEditor" Version="[17.0,)" DisplayName="Visual Studio core editor" />
      

Fertig!

Nun werden beim Buildvorgang sowohl Visual Studio 2019- als auch Visual Studio 2022-VSIX-Projekte erstellt.

Weitere Beispiele

  • ProPower-Tools
    • PeekF1
      • Ermöglicht die Anzeige einer Vorschau in einen Webbrowser mit Hilfeinformationen zu der ausgewählten Klasse/dem ausgewählten Objekt.
    • FixMixedTabs
      • Überprüft Ihre Dokumente und ersetzt Tabstoppzeichen durch Leerzeichen oder umgekehrt.

Nächste Schritte

Erfahren Sie in diesem umfassenden Leitfaden, wie Sie Ihre Erweiterung aktualisieren.