Visual Studio Code を使用した Store Commerce 拡張機能のデバッグ

Note

Dynamics 365 Commerce による Retail Interest Group は Yammer から Viva Engage に移行しました。 新しい Viva Engage コミュニティにアクセスできない場合は、このフォーム (https://aka.ms/JoinD365commerceVivaEngageCommunity) に入力して追加し、最新のディスカッションに参加してください。

この記事では、Visual Studio Code を使用して Microsoft Dynamics 365 Commerce Store Commerce 拡張機能をデバッグする方法について説明します。

Note

Visual Studio Code を使用して、64 ビット .NET Framework アプリのみをデバッグできます。 Store Commerce でオフラインの Commerce Runtime (CRT)/ハードウェア ステーション (HWS) コードをデバッグするには、Visual Studio 2019 以降を使用する必要があります。

  1. Store Commerce アプリを開きます。
  2. Visual Studio で、CRT または HWS コードを開きます。
  3. メニューで、デバッグ > プロセスに添付するを選択してから、Microsoft.Dynamics.Commerce.StoreCommerce.exe を選択します。

Visual Studio Code を使用して Store Commerce 拡張機能をデバッグするには、次の手順に従います。

  1. Visual Studio Codeをインストールします。

  2. Visual Studio Code を開き、Visual Studio Marketplace から VS コードの Microsoft Edge ツール をインストールします。

  3. 拡張機能を展開する前に、Store Commerce アプリをインストールします。 インストール プロセス中に、次の例に示すように --enablewebviewdevtools パラメーターを渡すことでデバッグ オプションを有効にします。

    .\StoreCommerce.Installer.exe install --enablewebviewdevtools

  4. InStore GitHub リポジトリ (repo) から Store Commerce 拡張機能サンプル コードをダウンロードするか、独自の拡張機能コードを使用します。

    Note

    管理者モードでは Visual Studio Code を実行しないでください。

  5. Visual Studio 開発者コマンド プロンプトを開き、コードを入力して Visual Studio Code を開きます。

  6. Visual Studio Code で、ファイル > フォルダーを開くを選択してから、拡張機能コード ルート フォルダーを開きます。

  7. Visual Studio Code で、ソリューション ディレクトリのルート フォルダーを選択したまま (または右クリック) にして、.vscode という名前の新しいフォルダーを作成します。

  8. .vscode フォルダー内で、launch.json という新しいファイルを作成します。

  9. launch.commerc ファイルで、次のコンフィギュレーションを追加して Store Commerce 拡張機能を構築およびデバッグします:

    • Store Commerce のデバッグ – このコンフィギュレーションにより、Store Commerce アプリが開き、デバッグ用に拡張コードが関連付けられます。
    • Store Commerce の構築とデバッグ - このコンフィギュレーションにより拡張コードが構築され、拡張機能が展開され、Store Commerce アプリが開き、デバッグ用に拡張コードが関連付けられます。
    • Store Commerce へのデバッガーの関連付け - このコンフィギュレーションにより、デバッグ用に Store Commerce アプリへの拡張コードが関連付けられますが、Store Commerce アプリは開きません。

  10. 次のコンフィギュレーション コードをコピーし、aunch.json ファイルに貼り付けてから、ファイルを保存します。

    {
    "version": "0.2.0",
    "configurations": [
        {
            "type": "pwa-msedge",
            "request": "launch",
            "port": 9222,
            "name": "Debug Store Commerce",
            "useWebView": true,
            "runtimeExecutable": "${env:ProgramFiles}/Microsoft Dynamics 365/10.0/Store Commerce/Microsoft/contentFiles/Microsoft.Dynamics.Commerce.StoreCommerce.exe",
            "userDataDir": "${env:LocalAppData}/Microsoft Dynamics 365/10.0/Data/Store Commerce/Pos",
            "url": "file:///${env:ProgramFiles}/Microsoft Dynamics 365/10.0/Store Commerce/Microsoft/contentFiles/Pos/Pos.html"
        },
        {
            "type": "pwa-msedge",
            "request": "launch",
            "port": 9222,
            "name": "Build and Debug Store Commerce",
            "useWebView": true,
            "runtimeExecutable": "${env:ProgramFiles}/Microsoft Dynamics 365/10.0/Store Commerce/Microsoft/contentFiles/Microsoft.Dynamics.Commerce.StoreCommerce.exe",
            "userDataDir": "${env:LocalAppData}/Microsoft Dynamics 365/10.0/Data/Store Commerce/Pos",
            "url": "file:///${env:ProgramFiles}/Microsoft Dynamics 365/10.0/Store Commerce/Microsoft/contentFiles/Pos/Pos.html",
            "preLaunchTask": "${defaultBuildTask}"
        },
        {
            "name": "Attach debugger to Store Commerce",
            "type": "pwa-msedge",
            "port": 9222,
            "request": "attach",
            "useWebView": true,
            "runtimeExecutable": "${env:ProgramFiles}/Microsoft Dynamics 365/10.0/Store Commerce/Microsoft/contentFiles/Microsoft.Dynamics.Commerce.StoreCommerce.exe"
        }
    ]
}

  11. .vscode フォルダー内で、tasks.json という新しいファイルを作成します。 このファイルを使用して、Store Commerce アプリを構築しインストールするためのコンフィギュレーションを作成します。

  12. 次のコンフィギュレーション コードをコピーして、tasks.json ファイルに貼り付けます。

    {
    "version": "2.0.0",
    "tasks": [
        {
            "label": "Build & Install Store Commerce Extension",
            "type": "shell",
            "command": "msbuild",
            "args": [
                "/p:Configuration=debug",
                "/p:InstallStoreCommerceExtensionsAfterBuild=true",
                "/t:build",
                "/m",
                "/consoleloggerparameters:NoSummary",
                "${workspaceFolder}"
            ],
            "group": {
                "kind": "build",
                "isDefault": true
            },
        }
    ]
}

  13. Visual Studio Code で、デバッグを選択し、シナリオの適切なオプションを選択してから、拡張子コードにブレークポイントを設定してデバッグを開始します。

デバッグの問題を診断する

msbuild エラー

以下のようなエラー メッセージが表示される場合があります: 「msbuild: "msbuild" という用語は、コマンドレット、関数、スクリプト ファイル、または操作可能なプログラムの名前として認識されません。」この場合、Visual Studio Code を閉じます。 次に、Visual Studio 開発者コマンド プロンプトを開き、ソリューション ディレクトリに移動し、コードを入力して Visual Studio Code を再度開き、正しい msbuild バージョンを設定します。

JSON ファイル コメント拡張子

.json ファイル コメントに関連するエラー メッセージが表示された場合は、.json ファイルを閉じてから、再度デバッグ コマンドを実行します。 または、.json ファイルのコメントをすべて削除してください。

  • Last updated on