build: cleanup Webpack configs

- The primary Webpack config at the project root had some unused code
  that was supposed to be used for building the browser example page.
  However, the browser example page uses its own Webpack config file,
  and the primary config is used only for bundling the library itself.
  Thus, we can remove this unused code and simplify the primary config.
- Use the `output.clean` option to make Webpack clease the `dist/`
  directory when building the library. This allows us to avoid running
  `npx rimraf dist/` as part of `npm run build`.
- Don't run `npm run build` as part of `npm run build:browser`. Since
  the browser example directly imports TypeScript code under `src/`, we
  don't need to bundle the library separately.

package.json

@@ -16,8 +16,8 @@
     "dist"
   ],
   "scripts": {
-    "build": "npm run clear && webpack --mode=production",
-    "build:browser": "npm run build && webpack -c examples/browser/webpack.config.js --mode=production && cp -a examples/browser/statics/. examples/browser/dist",
+    "build": "webpack --mode=production",
+    "build:browser": "webpack -c examples/browser/webpack.config.js --mode=production && cp -a examples/browser/statics/. examples/browser/dist",
     "clear": "rimraf dist/",
     "deploy": "npm run build:browser && gh-pages -d examples/browser/dist",
     "fix": "eslint --fix . && prettier --write .",

webpack.config.js

@@ -3,53 +3,30 @@ import {fileURLToPath} from "url";
 
 const __dirname = path.dirname(fileURLToPath(import.meta.url));
 
-export default function (env) {
-  const entry = {index: path.resolve(__dirname, "src/index.ts")};
-  const output = {
+export default /** @type {import("webpack").Configuration} */ ({
+  entry: path.resolve(__dirname, "src/index.ts"),
+  target: ["web", "es2018"],
+  module: {
+    rules: [
+      {
+        test: /\.ts$/,
+        use: "ts-loader",
+        exclude: /node_modules/,
+      },
+    ],
+  },
+  resolve: {
+    extensions: [".ts", ".js"],
+  },
+  output: {
+    clean: true,
     filename: "[name].js",
     path: path.resolve(__dirname, "dist"),
-  };
-
-  if (env.WEBPACK_SERVE) {
-    entry.example = path.resolve(__dirname, "example/example_browser.ts");
-    entry["example-browser-worker"] = path.resolve(
-      __dirname,
-      "example/example-browser-worker.ts"
-    );
-  } else {
-    output.library = {
+    library: {
       type: "module",
-    };
-  }
-
-  return {
-    entry,
-    target: ["web", "es2018"],
-    module: {
-      rules: [
-        {
-          test: /\.ts$/,
-          use: "ts-loader",
-          exclude: /node_modules/,
-        },
-      ],
-    },
-    resolve: {
-      extensions: [".ts", ".js"],
-    },
-    output,
-    devServer: {
-      static: "example",
-      host: "localhost",
-      port: 4200,
-    },
-    devtool: "source-map",
-    experiments: {
-      // Emit ESM only when bundling for production; avoid using ESM for the
-      // in-browser example.
-      // This is necessary because Firefox does not support import or
-      // import.meta inside web workers.
-      outputModule: !env.WEBPACK_SERVE,
     },
-  };
-}
+  },
+  experiments: {
+    outputModule: true,
+  },
+});