Delen via


ImageOptimizer - Stap voor stap een Visual Studio-extensie bijwerken

In deze handleiding worden alle stappen weergegeven die nodig zijn voor het toevoegen van ondersteuning voor Visual Studio 2022 terwijl visual Studio 2019-ondersteuning wordt gehandhaafd met behulp van de extensie Image Optimizer als casestudy.
Dit is bedoeld als een grondige handleiding met git commit-koppelingen naar elke stap, maar u kunt hier de voltooide pull request bekijken: https://github.com/madskristensen/ImageOptimizer/pull/46.

Aan het einde van deze handleiding hebben we ook aanvullende voorbeelden.

Stap 1: het project moderniseren

Zie Het project moderniseren.

git commit e052465

Eerst updaten we het VSIX- en unit-testproject naar .NET 4.7.2 in de eigenschappenpagina van de projecten.

Frameworkversie-update

Image Optimizer verwijst naar een aantal oude aangepaste 14.* en 15.*-pakketten. In plaats daarvan installeren we het Microsoft.VisualStudio.Sdk NuGet-pakket waarmee al onze vereiste verwijzingen worden samengevoegd.

-  <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>

Het bouwen van het project slaagt en we krijgen een paar threading-waarschuwingen. We corrigeren deze waarschuwingen door op ctrl en . te klikken en intellisense te gebruiken om de ontbrekende threadwissellijnen toe te voegen.

Stap 2: broncode herstructureren in een gedeeld project

Zie Gedeelde projecten.

Voor het ondersteunen van Visual Studio 2022 moet u een nieuw gedeeld project toevoegen dat de broncode van de extensie bevat die wordt gedeeld tussen de Visual Studio 2019- en Visual Studio 2022 VSIX-projecten.

  1. Een nieuw gedeeld project toevoegen aan uw oplossing

    git commit abf249d

    Gedeeld project toevoegen

  2. Voeg een verwijzing naar het gedeelde project toe aan uw VSIX-project.

    git commit e8e941e

    Gedeelde projectreferentie toevoegen

  3. Verplaats uw broncodebestanden (cs, xaml, resx) naar het nieuwe gedeelde project behalve voor het volgende:

    • source.extension.vsixmanifest
    • Extensiemetagegevensbestanden (pictogrammen, licenties, releaseopmerkingen, enzovoort)
    • VSCT-bestanden
    • Gekoppelde bestanden
    • Externe hulpprogramma's of bibliotheken die in de VSIX moeten worden opgenomen.

    git commit f31f051

    bestanden verplaatsen naar een gedeeld project

  4. Verplaats nu alle metagegevens, VSCT-bestanden, gekoppelde bestanden en externe hulpprogramma's/bibliotheken naar een gedeelde locatie en voeg ze weer toe als gekoppelde items aan het VSIX-project. verwijder niet source.extension.vsixmanifest.

    git commit 73ba920 - Bestanden verplaatsen

    git commit d5e36b2 - Externe hulpprogramma's/bibliotheken toevoegen

    1. Voor dit project moeten we het extensiepictogram, het VSCT-bestand en externe hulpprogramma's verplaatsen naar onze nieuwe map ImageOptimizer\Resources. Kopieer ze naar de gedeelde map en verwijder ze uit het VSIX-project.
    2. Ze zijn weer toegevoegd als gekoppelde items en als de items al gekoppeld zijn, kunnen ze blijven zoals ze zijn (bijvoorbeeld een licentie).
    3. Controleer of de Build Actie en andere eigenschappen correct zijn ingesteld in de toegevoegde gekoppelde bestanden door elk bestand te selecteren en het eigenschappenvenster te controleren. Voor ons project moesten we het volgende instellen:
      • Stel icon.png buildactie in op Content en markeer Opnemen in VSIX als true

      • Stel de buildactie van ImageOptimizer.vsct in op VSCTComplile en zet opneming in VSIX op false

      • Stel de buildactie van alle bestanden onder Resources\Tools in op Content en markeer het als Opnemen in VSIX naar true

        gekoppelde bestanden toevoegen aan het VSIX-project

      • Daarnaast is ImageOptimizer.cs een afhankelijkheid van ImageOptimizer.vsct. Hiervoor moeten we deze afhankelijkheid handmatig toevoegen aan het csproj-bestand:

        - <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>
        
      • Als het eigenschappenvenster voorkomt dat u een specifieke buildactie kunt instellen, kunt u de csproj handmatig wijzigen zoals hierboven beschreven en de buildactie indien nodig instellen.

  5. Bouw uw project om uw wijzigingen te valideren en eventuele fouten/problemen op te lossen. Raadpleeg de sectie Veelgestelde vragen voor veelvoorkomende problemen.

Stap 3: Een Visual Studio 2022 VSIX-project toevoegen

Zie "Visual Studio 2022"-doel toevoegen.

  1. Voeg een nieuw VSIX-project toe aan uw oplossing.

  2. Verwijder eventuele extra broncode in het nieuwe project, met uitzondering van source.extension.vsixmanifest.

    Een nieuw VSIX-project maken

  3. Voeg een verwijzing toe naar uw gedeelde project.

    git commit dd49cb2

    Verwijzing toevoegen aan gedeelde project-

  4. Voeg de gekoppelde bestanden uit uw Visual Studio 2019 VSIX-project toe en controleer of de eigenschappen 'Build Action' en 'Opnemen in VSIX' overeenkomen. Kopieer ook uw source.extension.vsixmanifest-bestand, we zullen het later aanpassen om Visual Studio 2022 te ondersteunen.

    git commit 98c43ee

    Gekoppelde bestanden toevoegen aan het VSIX-project

  5. Een poging tot build laat zien dat er een verwijzing naar System.Windows.Formsontbreekt. Voeg het toe aan ons Visual Studio 2022-project en bouw het opnieuw.

    git commit de71ccd

    + <Reference Include="System.Windows.Forms" />
    
  6. Upgrade Microsoft.VisualStudio.SDK en Microsoft.VSSDK.BuildTools pakketverwijzingen naar de Visual Studio 2022-versies.

    git commit d581fc3

    Notitie

    Dit zijn de nieuwste versies die beschikbaar zijn wanneer deze handleiding is gemaakt. Het is raadzaam om de nieuwste versies te krijgen die beschikbaar zijn.

    -<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. Bewerk uw source.extension.vsixmanifest-bestand om de targeting op Visual Studio 2022 weer te geven.

    git commit 9d393c7

    1. Stel de <InstallationTarget>-tag in om Visual Studio 2022 weer te geven en een amd64-payload aan te geven.

      <InstallationTarget Id="Microsoft.VisualStudio.Community" Version="[17.0,18.0)">
          <ProductArchitecture>amd64</ProductArchitecture>
      </InstallationTarget>
      
    2. Wijzig de vereiste zodat alleen Visual Studio 2022 en hoger wordt opgenomen:

      - <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" />
      

En we zijn klaar!

Het buildproces produceert nu zowel Visual Studio 2019 als Visual Studio 2022 VSIXes.

Andere voorbeelden

  • ProPower Tools
    • PeekF1
      • Hiermee kunt u een webbrowser bekijken met help-informatie over de geselecteerde klasse/het geselecteerde object.
    • FixMixedTabs
      • Scant uw documenten en vervangt tabs door spaties en andersom

Volgende stappen

Bereid u voor om uw extensie bij te werken door deze handleiding voor begin tot eind te lezen.