fix npm: watch problem matcher stalling default debug task (#112)

.vscode/extensions.json

@@ -1,5 +1,9 @@
 {
   // See http://go.microsoft.com/fwlink/?LinkId=827846
   // for the documentation about the extensions.json format
-  "recommendations": ["dbaeumer.vscode-eslint", "amodio.tsl-problem-matcher"]
+  "recommendations": [
+    "dbaeumer.vscode-eslint",
+    "amodio.tsl-problem-matcher",
+    "connor4312.esbuild-problem-matchers"
+  ]
 }

.vscode/tasks.json

@@ -6,7 +6,7 @@
 		{
 			"type": "npm",
 			"script": "watch",
-			"problemMatcher": "$ts-webpack-watch",
+			"problemMatcher": "$esbuild-watch",
 			"isBackground": true,
 			"presentation": {
 				"reveal": "never",

scripts/build.js

@@ -1,4 +1,10 @@
-(async () => {
+const production = process.argv.includes("--production");
+const watch = process.argv.includes('--watch');
+
+/**
+ * @see https://code.visualstudio.com/api/working-with-extensions/bundling-extension#using-esbuild
+ */
+async function main() {
   const ctx = await require("esbuild").context({
     entryPoints: {
       extension: "./src/extension.ts",
@@ -9,30 +15,60 @@
     format: "cjs",
     inject: ["./scripts/process-shim.js"],
     tsconfig: "./tsconfig.json",
-    define: process.argv.includes("--production")
+    define: production
       ? { "process.env.NODE_ENV": '"production"' }
       : undefined,
-    minify: process.argv.includes("--production"),
-    sourcemap: !process.argv.includes("--production"),
+    minify: production,
+    sourcemap: !production,
     plugins: [
-      {
-        name: "node-deps",
-        setup(build) {
-          build.onResolve({ filter: /^path$/ }, (args) => {
-            const path = require.resolve("../node_modules/path-browserify", {
-              paths: [__dirname],
-            });
-            return { path };
-          });
-        },
-      },
+      nodeDepsPlugin,
+      esbuildProblemMatcherPlugin,
     ],
   });
-  if (process.argv.includes("--watch")) {
+  if (watch) {
     await ctx.watch();
-    console.log("watching...");
   } else {
     await ctx.rebuild();
     await ctx.dispose();
   }
-})();
+}
+
+/**
+ * @type {import('esbuild').Plugin}
+ */
+const esbuildProblemMatcherPlugin = {
+  name: 'esbuild-problem-matcher',
+  setup(build) {
+    build.onStart(() => {
+      console.log('[watch] build started');
+    });
+    build.onEnd(result => {
+      result.errors.forEach(({ text, location }) => {
+        console.error(`✘ [ERROR] ${text}`);
+        console.error(`    ${location.file}:${location.line}:${location.column}:`);
+      });
+      console.log('[watch] build finished');
+    });
+  }
+};
+
+
+/**
+ * @type {import('esbuild').Plugin}
+ */
+const nodeDepsPlugin = {
+  name: "node-deps",
+  setup(build) {
+    build.onResolve({ filter: /^path$/ }, (args) => {
+      const path = require.resolve("../node_modules/path-browserify", {
+        paths: [__dirname],
+      });
+      return { path };
+    });
+  },
+};
+
+main().catch(e => {
+  console.error(e);
+  process.exit(1);
+});