Visual studio code configuration

[manuel3108]

I think it would be great if there would be a composer for adding Svelte
-specific Visual Studio code configuration, so it is less of a hassle.

.vscode/launch.json

{
        "version": "0.2.0",
        "configurations": [
                {
                        "name": "Launch server",
                        "request": "launch",
                        "runtimeArgs": ["run-script", "dev"],
                        "runtimeExecutable": "pnpm",
                        "skipFiles": ["<node_internals>/**"],
                        "type": "node",
                        "console": "integratedTerminal"
                },

                {
                        "type": "firefox",
                        "request": "launch",
                        "name": "Launch Firefox",
                        "reAttach": true,
                        "url": "http://127.0.0.1:5173",
                        "webRoot": "${workspaceFolder}"
                }
        ],
        "compounds": [
                {
                        "name": "Both",
                        "configurations": ["Launch server", "Launch Firefox"]
                }
        ]
}

.vscode/extensions.json

Note: This is a matter of personal taste and some of these could also be part of the other composers for Tailwind or Github Actions.

{
        "recommendations": [
// Tailwind support
                "bradlc.vscode-tailwindcss",
               // helps creating 🎸 commit messages in Conventional Commits format 
"vivaxy.vscode-conventional-commits",
               // Run Firefox with debugger attached "firefox-devtools.vscode-firefox-debug",
// Github actions Integration 
                "github.vscode-github-actions",
                "svelte.svelte-vscode",
// Load .nvmrc and setup nvm for launch configurations and terminals
                "henrynguyen5-vsc.vsc-nvm",
// most opionated
                // "k--kato.intellij-idea-keybindings",
                "1yib.svelte-bundle",
// Show documentation for Tailwind classes in-editor
                "austenc.tailwind-docs"
        ]
}

Also look for extensions with MDSveX support.

.vscode/settings.json

Set package manager

{
        "npm.packageManager": "pnpm"
}

[manuel3108]

Initially brought up by @tburny in svelte-compose/svelte-compose#23