Deploy vscode web with custom web extensions?

[jlewi]

Hi I've built a vscode extension and I'd like to deploy a version of vscode for web with the extension bundled.
I can build vscode for web from source and run it by following instructions.

I'm unclear about

1. To deploy it, do I need to serve all assets that get built in out?
2. Is there a different build rule for building a build optimized build for deployment?
3. How do I bundle additional extensions?

@AlexDzhus1994 seems like you might have done this based on #839 do you have a recipe you could share?

[r3m0t]

Have you looked at the code-server project?

[jlewi]

Appreciate the suggestion but I don't think I need a code-server. I want to run vscode entirely in the web so I don't think I need a vscode-server; thus I don't think I need code-server assuming that's what you are referring to.

The vscode repository contains code-web.sh. This runs a server hosting vscoding for web. The server is serving from sources. So I don't think the compiled JS is optimized for a production deployment. I'm looking for a recipe to actually turn those sources into an optimized JS bundle which I can then deploy from my server.

[jlewi]

The following recipe seems to work.

1. Build the vscode web assets using the following recipe

   yarn
   yarn compile-build
   yarn minify-vscode-reh-web
   

2. Create a static server that serves the directories

   • resources
   • out-vscode-reh-web-min on the path "out/"

3. Use workbench.html as the main html page and update it and your static server so that it properly substitutes in for the variables {{WORKBENCH_...}} in the template

[jlewi]

Spoke too soon. I'm struggling to figure out how to bundle additional extensions as built in extensions. Anyone got any pointers here?

• If I want to bundle it do I still use vcse to create an extension?
• It looks like the vscode web test server lets you specify extensionPaths and it then ends up looking in those files for a package.json. What package.json is that supposed to be?

[jlewi]

I think I figured this out there's two pieces to this.

One package your extension for web. You can follow the example e.g helloworld-web-sample. These assets will then need to be served by the server for vscode for web.

The main page "workbench.html" contains the HTML attribute vscode-workbench-web-configuration which gets set to a JSON dictionary containing important configuration information. The value
is the JSON representation of an instance of IWorkbenchConstructionOptions. Notably this contains additionalBuiltinExtensions which allows us to bundle in additional web extensions by setting the URIs they are being served

[factubsio]

Hi, found this a couple of years later, I can get my extension to somewhat load (the language is recognised) but I get errors when it actually runs, possibly from the minifcation?, I see 404 to e.g. /out/vs/workbench/services/languageDetection/browser/languageDetectionWebWorkerMain.js

I put my extension in 'static/extensions/0' but maybe it's how the extension has been built? th extension does work with ./scripts/code-web.sh --extensionPath, if that is worth anything.

If you have any insights I would super appreciate it!