Consider adding default tasks.json and launch.json for VS Code

[segevfiner]

For example:

tasks.json:

{
    "version": "2.0.0",
    "tasks": [
        {
            "label": "npm: dev",
            "type": "npm",
            "script": "dev",
            "detail": "vite",
            "problemMatcher": "$vite",
            "isBackground": true,
            "group": {
                "kind": "build",
                "isDefault": true
            },
            "presentation": {
                "reveal": "never",
            }
        },

    ]
}

launch.json:

{
    // Use IntelliSense to learn about possible attributes.
    // Hover to view descriptions of existing attributes.
    // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
    "version": "0.2.0",
    "configurations": [
        {
            "type": "chrome",
            "request": "launch",
            "name": "Launch Chrome against localhost",
            "url": "http://localhost:3000",
            "webRoot": "${workspaceFolder}",
            "preLaunchTask": "npm: dev"
        }
    ]
}

This is also a good opportunity to figure out any useful additional properties & tasks that can be useful to devs getting started with Vue & Vite.

[segevfiner]

Another thing to consider is https://code.visualstudio.com/docs/editor/debugging#_automatically-open-a-uri-when-debugging-a-server-program, which will require defining running Vite as a debug configuration, instead of defining it as a task. This can handle dynamic port allocation. But it currently has a problem with ANSI escapes and can't have problem matcher patterns defined in case we ever want to add any.

See microsoft/vscode#159391. Problem matchers for debug configurations or serverReadyAction for tasks might have been requested before.