Partager via


ImageOptimizer - Mettre à jour une extension Visual Studio étape par étape

Ce guide montre toutes les étapes requises pour ajouter la prise en charge de Visual Studio 2022 tout en conservant la prise en charge de Visual Studio 2019 à l’aide de l’extension Image Optimizer comme étude de cas.
Il s'agit d'un guide complet avec des liens vers chaque étape de git-commit, mais vous pouvez consulter la demande de tirage finalisée ici : https://github.com/madskristensen/ImageOptimizer/pull/46.

Nous avons également des exemples supplémentaires à la fin de ce guide.

Étape 1 : Moderniser le projet

Voir Moderniser le projet.

git commit e052465

Tout d’abord, nous faisons passer le projet de test unitaire VSIX à .NET 4.7.2 sous la page des propriétés des projets :

Mise à jour de la version du Framework

L’optimiseur d’image a référencé certains anciens packages personnalisés 14.* et 15.*, au lieu de cela, nous allons installer le package NuGet Microsoft.VisualStudio.Sdk qui consolide toutes nos références requises.

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

La création du projet réussit et nous obtenons quelques avertissements liés au multithreading. Nous corrigeons ces avertissements en cliquant sur ctrl et . et en utilisant IntelliSense pour ajouter les lignes de basculement de thread manquantes.

Étape 2 : refactoriser le code source dans un projet partagé

Consultez projets partagés.

La prise en charge de Visual Studio 2022 nécessite l’ajout d’un nouveau projet partagé qui contiendra le code source de l’extension qui sera partagé entre les projets Visual Studio 2019 et Visual Studio 2022 VSIX.

  1. Ajouter un nouveau projet partagé à votre solution

    git commit abf249d

    Ajouter un projet partagé

  2. Ajoutez une référence au projet partagé à votre projet VSIX.

    git commit e8e941e

    Ajouter une référence de projet partagé

  3. Déplacez vos fichiers de code source (cs, xaml, resx) vers le nouveau projet partagé à l’exception des suivants :

    • source.extension.vsixmanifest
    • Fichiers de métadonnées d’extension (icônes, licences, notes de publication, etc.)
    • Fichiers VSCT
    • Fichiers liés
    • Outils ou bibliothèques externes qui doivent être inclus dans VSIX

    git commit f31f051

    Déplacer des fichiers vers un projet partagé

  4. Déplacez maintenant toutes les métadonnées, fichiers VSCT, fichiers liés et outils/bibliothèques externes vers un emplacement partagé et ajoutez-les en tant qu’éléments liés au projet VSIX. Ne pas supprimer source.extension.vsixmanifest.

    Git commit 73ba920 - Déplacement de fichiers

    git commit d5e36b2 - Ajout d’outils/bibliothèques externes

    1. Pour ce projet, nous devons déplacer l’icône d’extension, le fichier VSCT et les outils externes vers notre nouveau dossier ImageOptimizer\Resources. Copiez-les dans le dossier partagé et supprimez-les du projet VSIX.
    2. Ajoutés à nouveau en tant qu'éléments liés, et si les éléments sont déjà liés, ils peuvent rester tels quels (par exemple, la licence).
    3. Vérifiez que l’action de génération et d’autres propriétés sont correctement définies dans les fichiers liés ajoutés en sélectionnant chacune d’elles et en vérifiant la fenêtre de l’outil propriétés. Pour notre projet, nous avons dû définir les éléments suivants :
      • Définir icon.pngAction de génération sur Content et cochez l'option Inclure dans VSIX sur true

      • Définir ImageOptimizer.vsct Action de génération sur VSCTComplile et Inclure dans VSIX sur false

      • Définir toutes les Actions de génération des fichiers sous Resources\Tools sur Content et marquez l'option Inclure dans VSIX sur true

        Ajouter des fichiers liés au projet VSIX

      • En outre, ImageOptimizer.cs est une dépendance de ImageOptimizer.vsct, pour cela, nous devons ajouter manuellement cette dépendance au fichier csproj :

        - <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>
        
      • Si la fenêtre de l’outil de propriétés vous empêche de définir une action de génération spécifique, vous pouvez modifier manuellement le csproj comme indiqué ci-dessus et définir l’action de génération en fonction des besoins.

  5. Générez votre projet pour valider vos modifications et résoudre les erreurs/problèmes. Consultez la section Foire aux questions pour connaître les problèmes courants.

Étape 3 : Ajouter un projet VSIX Visual Studio 2022

Voir Ajouter la cible de Visual Studio 2022.

  1. Ajoutez un nouveau projet VSIX à votre solution.

  2. Supprimez tout code source supplémentaire dans le nouveau projet, à l’exception de source.extension.vsixmanifest.

    Créer un projet VSIX

  3. Ajoutez une référence à votre projet partagé.

    git commit dd49cb2

    Ajouter une référence au projet partagé

  4. Ajoutez les fichiers liés à partir de votre projet VSIX Visual Studio 2019 et vérifiez que leurs propriétés « Action de génération » et « Inclure dans VSIX » correspondent. Copiez également votre fichier source.extension.vsixmanifest, nous le modifierons ultérieurement pour prendre en charge Visual Studio 2022.

    git commit 98c43ee

    Ajouter des fichiers liés au projet VSIX

  5. Une tentative de build indique que nous ne disposons pas d’une référence à System.Windows.Forms. Il vous suffit de l’ajouter à notre projet Visual Studio 2022 et de le reconstruire.

    git commit de71ccd

    + <Reference Include="System.Windows.Forms" />
    
  6. Mettez à jour les références de packages Microsoft.VisualStudio.SDK et Microsoft.VSSDK.BuildTools vers les versions de Visual Studio 2022.

    git commit d581fc3

    Remarque

    Il s’agit des dernières versions disponibles lors de la création de ce guide. Il est recommandé d’obtenir les dernières versions disponibles.

    -<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. Modifiez votre fichier source.extension.vsixmanifest pour refléter le ciblage de Visual Studio 2022.

    git commit 9d393c7

    1. Définissez la balise <InstallationTarget> pour qu'elle reflète Visual Studio 2022 et indique une charge de travail amd64 :

      <InstallationTarget Id="Microsoft.VisualStudio.Community" Version="[17.0,18.0)">
          <ProductArchitecture>amd64</ProductArchitecture>
      </InstallationTarget>
      
    2. Modifiez la configuration requise pour inclure uniquement Visual Studio 2022 et versions ultérieures :

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

Et on a fini !

Avec cela, la génération produit désormais à la fois Visual Studio 2019 et Visual Studio 2022 VSIXes.

Autres exemples

  • Outils ProPower
    • PeekF1
      • Permet d’afficher un aperçu dans un navigateur web avec des informations d’aide sur la classe/l’objet sélectionné.
    • FixMixedTabs
      • Analyse vos documents et remplace les onglets par des espaces ou inversement

Étapes suivantes

Préparez-vous à mettre à jour votre extension en lisant ce guide de A à Z .