Have 2 bundles

reconcile-js/package-lock.json

@@ -17,7 +17,8 @@
         "tslib": "2.8.1",
         "typescript": "5.8.3",
         "webpack": "^5.99.9",
-        "webpack-cli": "^6.0.1"
+        "webpack-cli": "^6.0.1",
+        "webpack-merge": "^6.0.1"
       }
     },
     "../pkg": {

reconcile-js/package.json

@@ -1,26 +1,28 @@
 {
-  "name": "reconcile",
-  "version": "0.4.0",
-  "main": "dist/index.js",
-  "types": "dist/types/index.d.ts",
-  "files": [
-    "dist/*"
-  ],
-  "scripts": {
-    "build": "webpack --mode production",
-    "format": "prettier --write \"./**/*.(ts|scss|json|html)\"",
-    "test": "NODE_OPTIONS=\"$NODE_OPTIONS --experimental-vm-modules\" jest"
-  },
-  "devDependencies": {
-    "@types/jest": "^30.0.0",
-    "jest": "^30.0.4",
-    "reconcile": "file:../pkg",
-    "ts-jest": "^29.4.0",
-    "ts-loader": "^9.5.2",
-    "tslib": "2.8.1",
-    "typescript": "5.8.3",
-    "webpack": "^5.99.9",
-    "webpack-cli": "^6.0.1",
-    "prettier": "^3.6.2"
-  }
+    "name": "reconcile",
+    "version": "0.4.0",
+    "main": "dist/reconcile.node.js",
+    "browser": "dist/reconcile.web.js",
+    "types": "dist/types/index.d.ts",
+    "files": [
+        "dist/**/*"
+    ],
+    "scripts": {
+        "build": "webpack --mode production",
+        "format": "prettier --write \"./**/*.(ts|scss|json|html)\"",
+        "test": "NODE_OPTIONS=\"$NODE_OPTIONS --experimental-vm-modules\" jest"
+    },
+    "devDependencies": {
+        "@types/jest": "^30.0.0",
+        "jest": "^30.0.4",
+        "prettier": "^3.6.2",
+        "reconcile": "file:../pkg",
+        "ts-jest": "^29.4.0",
+        "ts-loader": "^9.5.2",
+        "tslib": "2.8.1",
+        "typescript": "5.8.3",
+        "webpack": "^5.99.9",
+        "webpack-cli": "^6.0.1",
+        "webpack-merge": "^6.0.1"
+    }
 }

reconcile-js/webpack.config.js

@@ -1,37 +1,55 @@
-const path = require("path");
+const path = require('path');
+const { merge } = require('webpack-merge');
 
-
-module.exports = {
-    entry: "./src/index.ts",
-    module: {
-        rules: [
-            {
-                test: /\.ts$/,
-                use: ["ts-loader"]
-            },
-            {
-                test: /\.wasm$/,
-                type: "asset/inline"
-            }
-        ]
-    },
-    optimization: {
-        // the consuming project should take care of minification
-        minimize: false
-    },
-    resolve: {
-        extensions: [".ts"],
-        alias: {
-            root: __dirname,
-            src: path.resolve(__dirname, "src")
-        }
-    },
-    output: {
-        path: path.resolve(__dirname, "dist"),
-        filename: "index.js",
-        libraryTarget: "module"
-    },
-    experiments: {
-        outputModule: true
+const common = {
+  entry: './src/index.ts',
+  module: {
+    rules: [
+      {
+        test: /\.ts$/,
+        use: ['ts-loader'],
+      },
+      {
+        test: /\.wasm$/,
+        type: 'asset/inline',
+      },
+    ],
+  },
+  optimization: {
+    // the consuming project should take care of minification
+    minimize: false,
+  },
+  resolve: {
+    extensions: ['.ts', '.js'],
+    alias: {
+      root: __dirname,
+      src: path.resolve(__dirname, 'src'),
     },
+  },
+  performance: {
+    hints: false, // it's a library, no need to warn about its size
+  },
 };
+
+module.exports = [
+  merge(common, {
+    target: 'web',
+    output: {
+      path: path.resolve(__dirname, 'dist'),
+      filename: 'reconcile.web.js',
+      library: {
+        name: 'reconcile',
+        type: 'umd',
+      },
+      globalObject: 'this',
+    },
+  }),
+  merge(common, {
+    target: 'node',
+    output: {
+      path: path.resolve(__dirname, 'dist'),
+      filename: 'reconcile.node.js',
+      libraryTarget: 'commonjs2',
+    },
+  }),
+];