vscode-extension: Fix web support

.vscode/launch.json

@@ -12,6 +12,19 @@
         "${workspaceFolder}/src/web/vscode-extension/examples"
       ],
       "outFiles": ["${workspaceFolder}/src/web/vscode-extension/dist/*.js"]
+    },
+    {
+      "name": "Run VS Code Extension (Web)",
+      "type": "extensionHost",
+      "debugWebWorkerHost": true,
+      "request": "launch",
+      "runtimeExecutable": "${execPath}",
+      "args": [
+        "--extensionDevelopmentPath=${workspaceFolder}/src/web/vscode-extension",
+        "--extensionDevelopmentKind=web",
+        "${workspaceFolder}/src/web/vscode-extension/examples"
+      ],
+      "outFiles": ["${workspaceFolder}/src/web/vscode-extension/dist/*.js"]
     }
   ]
 }

src/web/vscode-extension/Makefile

@@ -8,9 +8,8 @@ install-deps:
 .PHONY: prepackage
 prepackage: all LICENSE.txt icon.png
 
-
 .PHONY: package
-package: prepackage
+package:
 	vsce package
 
 .PHONY: publish

src/web/vscode-extension/README.md

@@ -8,7 +8,7 @@ Logo-like Forth Turtle graphics.
 
 <div align="center">
 <div>
-<a href="https://mko.re/waforth/"><img src="https://raw.githubusercontent.com/remko/waforth/master/src/web/vscode-extension/doc/notebook.gif" alt="WAForth notebook"></a>
+<a href="https://github.dev/remko/waforth/blob/master/src/web/vscode-extension/examples/drawing-with-forth.wafnb"><img src="https://raw.githubusercontent.com/remko/waforth/master/src/web/vscode-extension/doc/notebook.gif" alt="WAForth notebook"></a>
 </div>
-<figcaption><em><a href="https://mko.re/waforth/">WAForth notebook</a></em></figcaption>
+<figcaption><em><a href="https://github.dev/remko/waforth/blob/master/src/web/vscode-extension/examples/drawing-with-forth.wafnb">WAForth notebook</a></em></figcaption>
 </div>

src/web/vscode-extension/build.js

@@ -15,16 +15,13 @@ for (const arg of process.argv.slice(2)) {
   }
 }
 
-esbuild
-  .build({
+const config = {
   bundle: true,
   logLevel: "info",
   entryPoints: [path.join(__dirname, "src/extension.ts")],
-    outfile: path.join(__dirname, "dist/extension.js"),
   format: "cjs",
   minify: !dev,
   sourcemap: true,
-    platform: "node",
   external: ["vscode"],
   loader: {
     ".wasm": "binary",
@@ -32,5 +29,21 @@ esbuild
     ".svg": "dataurl",
   },
   plugins: [wasmTextPlugin({ debug: true })],
-  })
-  .catch(() => process.exit(1));
+};
+
+(async () => {
+  try {
+    await esbuild.build({
+      ...config,
+      outfile: path.join(__dirname, "dist/extension.js"),
+      platform: "node",
+    });
+    await esbuild.build({
+      ...config,
+      outfile: path.join(__dirname, "dist/extension.web.js"),
+      platform: "browser",
+    });
+  } catch (e) {
+    process.exit(1);
+  }
+})();

src/web/vscode-extension/package.json

@@ -1,6 +1,6 @@
 {
   "name": "waforth-vscode-extension",
-  "version": "0.1.3",
+  "version": "0.1.5",
   "displayName": "WAForth",
   "description": "WAForth interactive notebooks",
   "categories": [
@@ -8,14 +8,15 @@
     "Notebooks"
   ],
   "keywords": [
-    "forth"
+    "forth",
+    "wafnb"
   ],
   "publisher": "remko",
   "license": "MIT",
   "repository": "github:remko/waforth",
   "icon": "icon.png",
   "main": "dist/extension.js",
-  "browser": "dist/extension.js",
+  "browser": "dist/extension.web.js",
   "engines": {
     "vscode": "^1.61.0"
   },