Setting up Svelte-Inspector with VS Code + WSL

Just ran into some issues while setting up the updated svelte-inspector vite plugin on my SvelteKit app I'm developing on Windows with WSL (Windows Subsystem for Linux). Figured I wouldn't be the only one to have this issue so here is a quick way to solve it!

Guide

Setup Svelte Inspector

For SvelteKit inside your svelte.config.js file add this:

//in svelte.config.js
const config = {
  // ...
  vitePlugin: {
    inspector: true,   
  },
}

‍

Add EDITOR config in your settings.json

In your VS Code settings file (settings.json) add the following:

"terminal.integrated.env.linux": { 
   "EDITOR": "code" 
}

‍

That's it, you should now be able to use the svelte-inspector tool with your WSL VS Code editor!

To use it just start your dev server and open up your project in the browser. Then use the default key combo Ctrl + Shift

‍

‍

‍

References

• https://github.com/yyx990803/launch-editor/issues/16

‍

‍