maninak
maninak

Reputation: 2726

How to restart/reload VS Code host window on extension source code file changes?

I'm developing a VS Code extension following the vscode-extension-samples/helloworld-sample.

Question:


When running the Run Extension launch configuration, tsc is executed in --watch mode watching for file changes and a new VS Code window is launched acting as the in-development-extension's host.

Expectation:

Updating the extentions's source code (e.g. extension.ts) updates the hosted extension's behaviour accordingly.

Actual:

Updating the extentions's source code dosn't have any effect in the hosted extension's behaviour.

Notes:

Updating the extentions's source code and then manually hitting Ctrl + R to reload the extension host window seems to "reload" the latest version of the extension's source code too, updating the hosted extension's behaviour as expected.


Here's my current config source code:

// launch.json
{
  "version": "0.2.0",
  "configurations": [{
      "name": "Develop Extension",
      "type": "extensionHost",
      "request": "launch",
      "runtimeExecutable": "${execPath}",
      "args": ["--extensionDevelopmentPath=${workspaceFolder}"],
      "outFiles": ["${workspaceFolder}/dist/**/*.js"],
      "preLaunchTask": "npm: dev",
      "postDebugTask": "Terminate All Tasks",
    },
  ]
}
// tasks.json
{
  "version": "2.0.0",
  "tasks": [
    {
      "type": "npm",
      "script": "dev",
      "detail": "Launch extension for local development in a new (host) VS Code window.",
      "problemMatcher": "$tsc-watch",
      "isBackground": true,
      "presentation": { "reveal": "always" },
      "group": {
        "kind": "build",
        "isDefault": true,
      },
      "icon": { "id": "tools" },
    },
    {
      "label": "Terminate All Tasks",
      "detail": "Stop all running tasks.", // e.g. useful for endless tasks like file watchers
      "command": "echo ${input:terminate}",
      "type": "shell",
      "problemMatcher": [],
      "icon": { "id": "stop-circle" },
    },
  ],
  "inputs": [
    {
      "id": "terminate",
      "type": "command",
      "command": "workbench.action.tasks.terminate",
      "args": "terminateAll",
    },
  ],
}

Upvotes: 6

Views: 2343

Answers (3)

Diego Lincoln
Diego Lincoln

Reputation: 55

Following @daniel example:

const watcher = vscode.workspace.createFileSystemWatcher(
  new vscode.RelativePattern(`${extensionDevPath}`, '**/*.cjs'),
)

watcher.onDidChange(({ scheme, path }) => {
  console.info(`${scheme} ${path} changed. Reloading VSCode...`)

  vscode.commands.executeCommand('workbench.action.reloadWindow')
})

Upvotes: 1

Daniel
Daniel

Reputation: 1205

You can try something like this. There's also reload webviews command somewhere, but not sure how to call it yet.

export async function activate(context: vscode.ExtensionContext) {
    context.subscriptions.push(
      vscode.commands.registerCommand(REFRESH_COMMAND, () => {
        vscode.commands.executeCommand("workbench.action.reloadWindow");
      })
    );
}

function watchForExtensionChanges() {
  const uiFolderPath = path.resolve(__dirname, "../src"); // Replace with the actual path to your "src" directory
  console.log("Start watching uiFolderPath :>> ", uiFolderPath);
  fs.watch(uiFolderPath, { recursive: true }, (eventType, filename) => {
    console.log(`File ${filename} changed`, eventType);
    if (eventType === "change") {
      vscode.commands.executeCommand(REFRESH_COMMAND);
    }
  });
}

Upvotes: 2

Mike Lischke
Mike Lischke

Reputation: 53532

There's no automatic reload of the extension development host. You have to do it manually.

Upvotes: 5

Related Questions