ImageOptimizer - Visual Studio 확장을 업데이트하는 단계별 방법

아티클
05/08/2023

이 가이드에서는 사례 연구를 통해 Image Optimizer 확장을 사용하여 Visual Studio 2019에 대한 지원을 유지하면서 Visual Studio 2022 지원을 추가하는 데 필요한 모든 단계를 보여 줍니다.
이 가이드는 각 단계로 연결되는 git commit 링크가 포함된 상세 가이드입니다. https://github.com/madskristensen/ImageOptimizer/pull/46에서 최종 PR을 살펴볼 수도 있습니다.

이 가이드에 마지막 부분에는 추가 샘플도 나와 있습니다.

1단계 - 프로젝트 현대화

See 프로젝트 현대화를 참조하세요.

git commit e052465

먼저 VSIX 및 단위 테스트 프로젝트를 프로젝트 속성 페이지의 .NET 4.7.2로 범프합니다.

Framework version bump

Image Optimizer는 오래된 사용자 지정 14.* 및 15.* 패키지를 참조하고 있는데 우리는 그 대신 필요한 모든 참조가 통합된 Microsoft.VisualStudio.Sdk NuGet 패키지를 설치하겠습니다.

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

프로젝트가 성공적으로 빌드되고 몇 개의 스레드 경고가 표시됩니다. 경고는 ctrl과 .를 클릭하고 intellisense로 누락된 스레드 전환 줄을 추가하여 해결합니다.

2단계 - 소스 코드를 공유 프로젝트로 리팩터링

공유 프로젝트를 참조하세요.

Visual Studio 2022를 지원하려면 Visual Studio 2019 및 Visual Studio 2022 VSIX 프로젝트 간에 공유될 확장의 소스 코드를 포함할 새 공유 프로젝트를 추가해야 합니다.

솔루션에 새 공유 프로젝트 추가

git commit abf249d
VSIX 프로젝트에 공유 프로젝트에 대한 참조를 추가합니다.

git commit e8e941e
다음을 제외하고 소스 코드 파일(cs, xaml, resx)을 새 공유 프로젝트로 이동합니다.
- source.extension.vsixmanifest
- 확장 메타데이터 파일(아이콘, 라이선스, 릴리스 정보 등)
- VSCT 파일
- 연결된 파일
- VSIX에 포함해야 하는 외부 도구 또는 라이브러리
git commit f31f051
이제 모든 메타데이터, VSCT 파일, 연결된 파일, 외부 도구/라이브러리를 공유 위치로 이동하고 VSIX 프로젝트에 연결된 항목으로 다시 추가합니다. source.extension.vsixmanifest는 제거하지 마세요.

git commit 73ba920 - 파일 이동

git commit d5e36b2 - 외부 도구/라이브러리 추가
1. 이 프로젝트의 경우 확장 아이콘, VSCT 파일, 외부 도구를 새 폴더 ImageOptimizer\Resources로 이동해야 합니다. 해당 항목을 공유 폴더에 복사하고 VSIX 프로젝트에서 제거합니다.
2. 항목을 다시 연결된 항목으로 추가하고 항목이 이미 연결된 항목인 경우 그대로 유지합니다(예: 라이선스).
3. 각 항목을 선택하고 속성 도구 창을 확인하여 추가한 연결된 파일에서 빌드 작업 및 기타 속성이 올바르게 설정되었는지 확인합니다. 프로젝트의 경우 다음을 설정해야 했습니다.
  - icon.png 빌드 작업을 Content로 설정하고 VSIX에 포함을 true로 표시합니다.
  - ImageOptimizer.vsct 빌드 작업을 VSCTComplile로 설정하고 VSIX에 포함을 false로 표시합니다.
  - Resources\Tools 아래에 있는 파일의 모든 빌드 작업을 Content로 설정하고 VSIX에 포함을 true로 표시합니다.
  - ImageOptimizer.cs는 ImageOptimizer.vsct의 종속성입니다. 따라서 이 종속성을 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>
```
  - 속성 도구 창에서 특정 빌드 작업을 설정할 수 없는 경우 위에서처럼 필요에 따라 수동으로 csproj를 수정하고 빌드 작업을 설정할 수 있습니다.
프로젝트를 빌드하여 변경 내용을 확인하고 오류/문제를 해결합니다. 자주 발생하는 문제는 자주 묻는 질문 섹션을 참조하세요.

3단계 - Visual Studio 2022 VSIX 프로젝트 추가

Visual Studio 2022 대상 추가를 참조하세요.

솔루션에 새 VSIX 프로젝트를 추가합니다.
source.extension.vsixmanifest.를 제외하고 새 프로젝트에서 추가 소스 코드를 제거합니다.
공유 프로젝트에 참조를 추가합니다.

git commit dd49cb2
Visual Studio 2019 VSIX 프로젝트의 연결된 파일을 추가하고 "빌드 작업" 속성과 "VSIX에 포함" 속성이 일치하는지 확인합니다. source.extension.vsixmanifest 파일도 복사합니다. 이 파일은 뒤에서 Visual Studio 2022를 지원하도록 수정할 것입니다.

git commit 98c43ee
빌드를 시도해 보면 System.Windows.Forms에 대한 참조가 누락되었음을 알 수 있습니다. 참조를 Visual Studio 2022 프로젝트에 추가하고 다시 빌드합니다.

git commit de71ccd
```
+ <Reference Include="System.Windows.Forms" />
```

Microsoft.VisualStudio.SDK 및 Microsoft.VSSDK.BuildTools 패키지 참조를 Visual Studio 2022 버전으로 업그레이드합니다.

git commit d581fc3

참고 항목

이는 이 가이드를 작성하는 시점의 최신 버전입니다. 해당 시점의 최신 버전을 받는 것이 좋습니다.

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

source.extension.vsixmanifest 파일이 Visual Studio 2022 대상 지정을 반영하도록 편집합니다.

git commit 9d393c7

<InstallationTarget> 태그가 Visual Studio 2022를 반영하도록 설정하고 amd64 페이로드를 명시합니다.

<InstallationTarget Id="Microsoft.VisualStudio.Community" Version="[17.0,18.0)">
    <ProductArchitecture>amd64</ProductArchitecture>
</InstallationTarget>

Prerequisite가 Visual Studio 2022 이상만 포함하도록 수정합니다.

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

다 됐습니다!

이제 빌드하면 Visual Studio 2019 VSIX와 Visual Studio 2022 VSIX가 모두 생성됩니다.

기타 샘플

ProPower 도구
- PeekF1
  - 웹 브라우저를 피킹하여 선택한 클래스/개체에 대한 도움말 정보를 볼 수 있습니다.
- FixMixedTabs
  - 문서를 검사하여 탭을 공백으로 또는 공백을 탭으로 바꿉니다.

다음 단계

시작부터 끝까지 안내하는 가이드를 참조하여 확장을 업데이트할 준비를 하세요.

Share via