Compartir a través de


ImageOptimizer: actualización de una extensión de Visual Studio paso a paso

En esta guía se muestran todos los pasos necesarios para agregar compatibilidad con Visual Studio 2022, al tiempo que se mantiene la compatibilidad con Visual Studio 2019 mediante la extensión Image Optimizer como caso práctico.
Está pensada para ser una guía exhaustiva con vínculos de confirmación de Git para cada paso, pero aquí puede ver la PR finalizada: https://github.com/madskristensen/ImageOptimizer/pull/46.

Al final de esta guía también se incluyen ejemplos adicionales.

Paso 1: Modernización del proyecto

Vea Modernización del proyecto.

Confirmación de Git e052465

En primer lugar, actualizamos el proyecto VSIX y de prueba unitaria a .NET 4.7.2 mediante la página de propiedades de los proyectos.

Incremento de versión del framework

Image Optimizer hace referencia a algunos paquetes personalizados antiguos de 14.* y 15.*, en su lugar, instalaremos el paquete nuGet Microsoft.VisualStudio.Sdk que consolida todas nuestras referencias necesarias.

-  <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 compilación del proyecto se realiza correctamente y se generan algunas advertencias de subprocesos. Para corregir estas advertencias, haga clic en ctrl y . y use intellisense para agregar las líneas de conmutación de subprocesos que faltan.

Paso 2: Refactorización del código fuente en un proyecto compartido

Vea Proyectos compartidos.

La compatibilidad con Visual Studio 2022 requiere agregar un nuevo proyecto compartido que contendrá el código fuente de la extensión que se compartirá entre los proyectos VSIX de Visual Studio 2019 y Visual Studio 2022.

  1. Adición de un nuevo proyecto compartido a la solución

    Confirmación de Git abf249d

    Agregar proyecto compartido

  2. Agregue una referencia al proyecto compartido al proyecto VSIX.

    Confirmación de Git e8e941e

    Agregar referencia de proyecto compartido

  3. Mueva los archivos de código fuente (cs, xaml, resx) al nuevo proyecto compartido excepto para lo siguiente:

    • source.extension.vsixmanifest
    • Archivos de metadatos de extensión (iconos, licencias, notas de la versión, etc.)
    • Archivos VSCT
    • Archivos vinculados
    • Herramientas o bibliotecas externas que deben incluirse en VSIX

    Confirmación de Git f31f051

    Mover archivos al proyecto compartido

  4. Ahora mueva todos los metadatos, archivos VSCT, archivos vinculados y herramientas o bibliotecas externas a una ubicación compartida y agréguelos como elementos vinculados al proyecto VSIX. No quite source.extension.vsixmanifest.

    Confirmación de Git 73ba920: movimiento de archivos

    Git commit d5e36b2 - Añadiendo herramientas/bibliotecas externas

    1. Para este proyecto, es necesario mover el icono de extensión, el archivo VSCT y las herramientas externas a nuestra nueva carpeta ImageOptimizer\Resources. Cópielos en la carpeta compartida y quítelos del proyecto VSIX.
    2. Los agregó como elementos vinculados y si los elementos ya están vinculados pueden permanecer tal como están (licencia por ejemplo).
    3. Compruebe que la acción de compilación y otras propiedades se establecen correctamente en los archivos vinculados agregados seleccionando cada una de ellas y comprobando la ventana de herramientas de propiedades. Para nuestro proyecto tuvimos que establecer lo siguiente:
      • Se ha establecido la acción de compilación icon.png en Content y se ha marcado Incluir en VSIX como true

      • Se ha establecido la acción de compilación ImageOptimizer.vsct en VSCTComplile e Incluir en VSIX en false

      • Se han establecido todas las acciones de compilación de los archivos de Resources\Tools en Content y se marcado Incluir en VSIX como true

        Agregar archivos vinculados al proyecto VSIX

      • Además, ImageOptimizer.cs es una dependencia de ImageOptimizer.vsct, para esto tenemos que agregar manualmente esta dependencia al archivo 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 ventana de herramientas de propiedades le impide establecer una acción de compilación específica, puede modificar manualmente csproj como se ha hecho anteriormente y establecer la acción de compilación según sea necesario.

  5. Compile el proyecto para validar los cambios y corregir cualquier error o problema. Consulte la sección Preguntas más frecuentes para ver los problemas comunes.

Paso 3: Agregar un proyecto VSIX de Visual Studio 2022

Vea Adición de un destino de Visual Studio 2022.

  1. Agregue un nuevo proyecto VSIX a la solución.

  2. Quite cualquier código fuente adicional en el nuevo proyecto, excepto source.extension.vsixmanifest.

    Crear un nuevo proyecto VSIX

  3. Agregue una referencia al proyecto compartido.

    Confirmación de Git dd49cb2

    Agregar referencia al proyecto compartido

  4. Agregue los archivos vinculados del proyecto VSIX de Visual Studio 2019 y valide que sus propiedades "Acción de compilación" e "Incluir en VSIX" coincidan. Copie también el archivo de source.extension.vsixmanifest, lo modificaremos más adelante para admitir Visual Studio 2022.

    Confirmación de Git 98c43ee

    agregar archivos vinculados al proyecto VSIX

  5. Un intento de compilación muestra que falta una referencia a System.Windows.Forms. Simplemente agréguelo al proyecto de Visual Studio 2022 y recompile.

    Confirmación de Git de71ccd

    + <Reference Include="System.Windows.Forms" />
    
  6. Actualice las referencias de paquete de Microsoft.VisualStudio.SDK y Microsoft.VSSDK.BuildTools a las versiones de Visual Studio 2022.

    Confirmación de Git d581fc3

    Nota

    Estas son las versiones más recientes disponibles cuando se creó esta guía. Se recomienda obtener las versiones más recientes 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. Edite el archivo source.extension.vsixmanifest para reflejar la selección de Visual Studio 2022 como destino.

    Confirmación de Git 9d393c7

    1. Establezca la etiqueta <InstallationTarget> para que refleje Visual Studio 2022 e indique una carga de amd64:

      <InstallationTarget Id="Microsoft.VisualStudio.Community" Version="[17.0,18.0)">
          <ProductArchitecture>amd64</ProductArchitecture>
      </InstallationTarget>
      
    2. Modifique el requisito previo para incluir solo Visual Studio 2022 y versiones posteriores:

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

¡Y ya hemos terminado!

Con esto, ahora la compilación genera archivos VSIX de Visual Studio 2019 y Visual Studio 2022.

Otros ejemplos

  • ProPower Tools
    • PeekF1
      • Permite examinar un explorador web con información de ayuda sobre la clase o el objeto seleccionados.
    • FixMixedTabs
      • Examina los documentos y reemplaza las pestañas por espacios o viceversa

Pasos siguientes

Para preparar la actualización de la extensión, lea esta guía de inicio a fin.