Bug 37824: Replace webpack with rspack for fun and profit

I left the webpack.config.js as well as the devDependencies in place for now.
We can remove them in a follow-up patch on this bug after testing it out.

To test:
1) Run js:build and js:build:prod
2) Note the build time
3) Apply patch
4) Run yarn install
5) Run js:build and js:build:prod again
6) Note the much faster build time
7) Extra credit: take a look at the ERM or preservations module and make sure everything works as expected.
8) Extra credit: run the cypress tests.
9) Sign off or give your opinion

Signed-off-by: Marcel de Rooy <m.de.rooy@rijksmuseum.nl>
Looks faster to me. Where webpack failed for me (Killed, error 137), this passed.
Signed-off-by: Martin Renvoize <martin.renvoize@ptfs-europe.com>
Signed-off-by: Katrin Fischer <katrin.fischer@bsz-bw.de>
(cherry picked from commit 28b6294461)
Signed-off-by: Lucas Gass <lucas@bywatersolutions.com>

package.json

@@ -47,9 +47,10 @@
     "css:build": "gulp css && gulp css --view opac",
     "css:build:prod": "gulp build && gulp build --view opac",
     "css:watch": "gulp watch",
-    "js:build": "webpack --mode development",
-    "js:watch": "webpack --mode development --watch",
-    "js:build:prod": "webpack --mode production",
+    "js:build": "rspack build --mode development",
+    "js:build:analyze": "rspack build --mode development --analyze",
+    "js:watch": "rspack build --mode development --watch",
+    "js:build:prod": "rspack build --mode production",
     "build": "yarn css:build && yarn js:build && yarn api:bundle",
     "build:prod": "yarn css:build:prod && yarn js:build:prod && yarn api:bundle",
     "cypress": "cypress",
@@ -69,6 +70,8 @@
   "devDependencies": {
     "@babel/core": "^7.17.5",
     "@babel/preset-env": "^7.16.11",
+    "@rspack/cli": "^1.0.1",
+    "@rspack/core": "^1.0.1",
     "@vue/compiler-sfc": "^3.2.31",
     "babel-loader": "^8.2.3",
     "babelify": "^10.0.0",

rspack.config.js

@@ -0,0 +1,66 @@
+const { VueLoaderPlugin } = require("vue-loader");
+//const autoprefixer = require("autoprefixer");
+const path = require("path");
+const rspack = require("@rspack/core");
+
+module.exports = {
+    experiments: {
+        css: true,
+    },
+    entry: {
+        erm: "./koha-tmpl/intranet-tmpl/prog/js/vue/modules/erm.ts",
+        preservation:
+            "./koha-tmpl/intranet-tmpl/prog/js/vue/modules/preservation.ts",
+        "admin/record_sources":
+            "./koha-tmpl/intranet-tmpl/prog/js/vue/modules/admin/record_sources.ts",
+    },
+    output: {
+        filename: "[name].js",
+        path: path.resolve(
+            __dirname,
+            "koha-tmpl/intranet-tmpl/prog/js/vue/dist/"
+        ),
+        chunkFilename: "[name].js",
+    },
+    module: {
+        rules: [
+            {
+                test: /\.vue$/,
+                loader: "vue-loader",
+                options: {
+                    experimentalInlineMatchResource: true,
+                },
+                exclude: [path.resolve(__dirname, "t/cypress/")],
+            },
+            {
+                test: /\.ts$/,
+                loader: "builtin:swc-loader",
+                options: {
+                    jsc: {
+                        parser: {
+                            syntax: "typescript",
+                        },
+                    },
+                    appendTsSuffixTo: [/\.vue$/],
+                },
+                exclude: [
+                    /node_modules/,
+                    path.resolve(__dirname, "t/cypress/"),
+                ],
+                type: "javascript/auto",
+            },
+            {
+                test: /\.css$/i,
+                type: "javascript/auto",
+                use: ["style-loader", "css-loader"],
+            },
+        ],
+    },
+    plugins: [
+        new VueLoaderPlugin(),
+        new rspack.DefinePlugin({
+            __VUE_OPTIONS_API__: true,
+            __VUE_PROD_DEVTOOLS__: false,
+        }),
+    ],
+};