visual-studiovue.jsvisual-studio-2022visual-studio-templates

Visual Studio 2022 .esproj Default Client Browser


With the new Visual Studio 2022 version 17.7 release containing the new DOTNET API - Vue (using Vite) template, I am reconsidering using the .esproj project type. The new project is a good starting point for creating a Vue - DotNet Api project that launches both the client project and the API project on compile with f5.

One strange quirk is that it launches the Edge browser for the client project (but not the API project for some reason) despite Chrome being my default browser.

How can you launch the client Vue project with the browser of your choice?


Solution

  • In the Vue .esproj project, there is a file in the .vscode folder called launch.json. By default, the "edge" browser is the first entry (for some mysterious reason...). Switching the order and moving the Chrome entry to the first position and that makes Chrome the one that is launched on compile with f5.

    For some reason, it is not a valid option to add Firefox as an entry at this time. I tried adding a 'firefox' entry to the 'type' in the json schema but it did not enable the option as another error is thrown further down the stack.

    {
      "version": "0.2.0",
      "configurations": 
      [
          {
            "type": "chrome",
            "request": "launch",
            "name": "localhost (Chrome)",
            "url": "https://localhost:5173",
            "webRoot": "${workspaceFolder}"
          },
          {
            "type": "edge",
            "request": "launch",
            "name": "localhost (Edge)",
            "url": "https://localhost:5173",
            "webRoot": "${workspaceFolder}"
          }
      ]
    }