Zenn
😺

Visual Studio Codeで.NET 4.7.2のWPFアプリケーションを開発する手順

2024/07/06に公開
.NET
C#
WPF
tech

この記事では、Visual Studio Code（VSCode）で.NET 4.7.2のWPF（Windows Presentation Foundation）アプリケーションを開発する手順を説明します。Visual Studio 2022 Community Editionをインストールできない場合には、MSBuildをポータブルでダウンロードして使用する方法も含めます。

以下参考ソース
https://github.com/SakakitaniJunya/wpf-clean-architecture

前提条件

  • Visual Studio Codeがインストールされていること
  • .NET Framework 4.7.2がインストールされていること
  • （オプション）Visual Studio 2022 Community Editionがインストールされていること

手順

1. MSBuildの設定

1.1 Visual Studio 2022 Community Editionがインストールされている場合

MSBuildのパスを通します。Visual Studio 2022のMSBuildのパスは以下の通りです：

C:\Program Files\Microsoft Visual Studio\2022\Community\MSBuild\Current\Bin

このパスを環境変数PATHに追加します。

1.2 Visual Studio 2022 Community Editionがインストールできない場合

MSBuildをポータブルでダウンロードして使用します。

  1. MSBuildのポータブルバージョンをダウンロードします。
  2. ダウンロードしたファイルを解凍し、任意の場所に保存します。例えば、C:\MSBuildに保存します。
  3. C:\MSBuild\MSBuild\15.0\Binを環境変数PATHに追加します。

2. VSCodeで新しいWPFプロジェクトを作成

  1. VSCodeを開き、空のフォルダーを作成または開きます。

  2. 新しいWPFプロジェクトを作成するために、以下のコマンドを使用します。

    dotnet new wpf -n MyWpfApp -f net472

3. VSCodeの設定

3.1 タスクの設定

VSCodeでビルドタスクを設定します。

  1. .vscodeフォルダーを作成し、その中にtasks.jsonファイルを作成します。

  2. 以下の内容をtasks.jsonに追加します。

    {
    "version": "2.0.0",
    "tasks": [
        {
            "label": "build",
            "command": "C:\\Program Files\\Microsoft Visual Studio\\2022\\Community\\MSBuild\\Current\\Bin\\MSBuild.exe",
            "type": "shell",
            "args": [
                "${workspaceFolder}/MyWpfApp.csproj",
                "/p:Configuration=Debug"
            ],
            "problemMatcher": "$msCompile",
            "group": {
                "kind": "build",
                "isDefault": true
            }
        }
    ]
}

    注意: MSBuildをポータブルバージョンで使用する場合、commandのパスを以下のように変更します。

    "command": "C:\\MSBuild\\MSBuild\\15.0\\Bin\\MSBuild.exe"

3.2 デバッグの設定

VSCodeでデバッグ設定を行います。

  1. .vscodeフォルダーにlaunch.jsonファイルを作成します。

  2. 以下の内容をlaunch.jsonに追加します。

    {
    "version": "0.2.0",
    "configurations": [
        {
            "name": ".NET Framework Launch (WPF)",
            "type": "clr",
            "request": "launch",
            "preLaunchTask": "build",
            "program": "${workspaceFolder}/bin/Debug/net472/MyWpfApp.exe",
            "args": [],
            "cwd": "${workspaceFolder}",
            "console": "internalConsole",
            "stopAtEntry": false
        },
        {
            "name": ".NET Framework Attach",
            "type": "clr",
            "request": "attach",
            "processId": "${command:pickProcess}"
        }
    ]
}

4. プロジェクトのビルドとデバッグ

4.1 プロジェクトのビルド

  1. VSCodeでターミナルを開き、以下のコマンドでプロジェクトをビルドします。

    dotnet build MyWpfApp

4.2 プロジェクトの実行とデバッグ

  1. VSCodeでデバッグビューを開き、デバッグ構成として「.NET Framework Launch (WPF)」を選択します。
  2. Run and DebugビューでF5キーを押してデバッグを開始します。これにより、アプリケーションがビルドされ、VSCode内で実行されます。

4.3 実行中のプロセスにアタッチする

  1. WPFアプリケーションを通常通り起動します（例: dotnet runなど）。
  2. VSCodeでデバッグビューを開き、デバッグ構成として「.NET Framework Attach」を選択します。
  3. Run and DebugビューでF5キーを押すと、実行中のプロセスのリストが表示されます。
  4. デバッグしたいプロセスを選択すると、VSCodeのデバッガがそのプロセスに接続されます。

Discussion