Press F5 to open a new window with your extension loaded.
Set breakpoints in your code inside src/extension.ts to debug your extension.
From the debug console, you can see the output or errors if any.
Make changes to Frontend
Run npm run rollup to compile your svelte files into js files present in out/compiled dir.
Make changes to your svelte code and the js files will be automatically re-compiled.
Inorder to view your changes, after starting the extension in development mode, Press (Ctrl+R or Cmd+R on Mac) to reload the window with the fresh compiled js.
To view the dev tools, press ctrl + shift + p to open the command palette and run > Developer: Open Webview Developer tools to open chrome dev tools.
Make
You can relaunch the extension from the debug toolbar after changing code in src/extension.ts.
You can also reload (Ctrl+R or Cmd+R on Mac) the VS Code window with your extension to load your changes.
package.json - this is the manifest file in which you declare your extension and command.
The sample plugin registers a command and defines its title and command name. With this information VS Code can show the command in the command palette. It doesn’t yet need to load the plugin.
src/extension.ts - this is the main file where you will provide the implementation of your command.
The file exports one function, activate, which is called the very first time your extension is activated (in this case by executing the command). Inside the activate function we call registerCommand.
We pass the function containing the implementation of the command as the second parameter to registerCommand.