ui_migration upgrade(nodejs) upgrade to nodejs 26, add cofiguration for new package versions and VITE rolldown

.gitlab-ci.yml

@@ -18,7 +18,7 @@ include:
 .javascript_webapp:
   extends: .javascript
   variables:
-    JS_IMAGE: node:20
+    JS_IMAGE: node:26
     JS_PATH: webapp
     JS_CACHE_PATH: webapp/node_modules
 

webapp/package-lock.json

@@ -21,6 +21,7 @@
         "vue": "^3.5.34"
       },
       "devDependencies": {
+        "@eslint/js": "^10.0.1",
         "@pinia/testing": "^1.0.3",
         "@vitejs/plugin-vue": "^6.0.7",
         "@vitest/coverage-v8": "^4.1.7",
@@ -34,6 +35,7 @@
         "eslint-plugin-pinia": "^0.4.2",
         "eslint-plugin-prettier": "^5.5.5",
         "eslint-plugin-vue": "^10.9.1",
+        "globals": "^17.6.0",
         "happy-dom": "^20.9.0",
         "less": "^4.6.4",
         "postcss-html": "^1.8.1",
@@ -47,7 +49,7 @@
         "vitest": "^4.1.7"
       },
       "engines": {
-        "node": ">=20.0.0"
+        "node": ">=26.0.0"
       }
     },
     "node_modules/@babel/code-frame": {
@@ -475,6 +477,27 @@
         "node": "^20.19.0 || ^22.13.0 || >=24"
       }
     },
+    "node_modules/@eslint/js": {
+      "version": "10.0.1",
+      "resolved": "https://registry.npmjs.org/@eslint/js/-/js-10.0.1.tgz",
+      "integrity": "sha512-zeR9k5pd4gxjZ0abRoIaxdc7I3nDktoXZk2qOv9gCNWx3mVwEn32VRhyLaRsDiJjTs0xq/T8mfPtyuXu7GWBcA==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": "^20.19.0 || ^22.13.0 || >=24"
+      },
+      "funding": {
+        "url": "https://eslint.org/donate"
+      },
+      "peerDependencies": {
+        "eslint": "^10.0.0"
+      },
+      "peerDependenciesMeta": {
+        "eslint": {
+          "optional": true
+        }
+      }
+    },
     "node_modules/@eslint/object-schema": {
       "version": "3.0.5",
       "resolved": "https://registry.npmjs.org/@eslint/object-schema/-/object-schema-3.0.5.tgz",
@@ -802,6 +825,9 @@
         "arm64"
       ],
       "dev": true,
+      "libc": [
+        "glibc"
+      ],
       "license": "MIT",
       "optional": true,
       "os": [
@@ -819,6 +845,9 @@
         "arm64"
       ],
       "dev": true,
+      "libc": [
+        "musl"
+      ],
       "license": "MIT",
       "optional": true,
       "os": [
@@ -836,6 +865,9 @@
         "ppc64"
       ],
       "dev": true,
+      "libc": [
+        "glibc"
+      ],
       "license": "MIT",
       "optional": true,
       "os": [
@@ -853,6 +885,9 @@
         "s390x"
       ],
       "dev": true,
+      "libc": [
+        "glibc"
+      ],
       "license": "MIT",
       "optional": true,
       "os": [
@@ -870,6 +905,9 @@
         "x64"
       ],
       "dev": true,
+      "libc": [
+        "glibc"
+      ],
       "license": "MIT",
       "optional": true,
       "os": [
@@ -887,6 +925,9 @@
         "x64"
       ],
       "dev": true,
+      "libc": [
+        "musl"
+      ],
       "license": "MIT",
       "optional": true,
       "os": [
@@ -3227,6 +3268,19 @@
         "which": "bin/which"
       }
     },
+    "node_modules/globals": {
+      "version": "17.6.0",
+      "resolved": "https://registry.npmjs.org/globals/-/globals-17.6.0.tgz",
+      "integrity": "sha512-sepffkT8stwnIYbsMBpoCHJuJM5l98FUF2AnE07hfvE0m/qp3R586hw4jF4uadbhvg1ooIdzuu7CsfD2jzCaNA==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
     "node_modules/globby": {
       "version": "16.2.0",
       "resolved": "https://registry.npmjs.org/globby/-/globby-16.2.0.tgz",
@@ -3974,6 +4028,9 @@
         "arm64"
       ],
       "dev": true,
+      "libc": [
+        "glibc"
+      ],
       "license": "MPL-2.0",
       "optional": true,
       "os": [
@@ -3995,6 +4052,9 @@
         "arm64"
       ],
       "dev": true,
+      "libc": [
+        "musl"
+      ],
       "license": "MPL-2.0",
       "optional": true,
       "os": [
@@ -4016,6 +4076,9 @@
         "x64"
       ],
       "dev": true,
+      "libc": [
+        "glibc"
+      ],
       "license": "MPL-2.0",
       "optional": true,
       "os": [
@@ -4037,6 +4100,9 @@
         "x64"
       ],
       "dev": true,
+      "libc": [
+        "musl"
+      ],
       "license": "MPL-2.0",
       "optional": true,
       "os": [

webapp/package.json

@@ -5,7 +5,7 @@
   "description": "User interface for the OpenFlexure Microscope Server",
   "author": "OpenFlexure <contact@openflexure.org> (https://www.openflexure.org)",
   "engines": {
-    "node": ">=20.0.0"
+    "node": ">=26.0.0"
   },
   "scripts": {
     "gv": "genversion src/version.js",
@@ -31,6 +31,7 @@
     "vue": "^3.5.34"
   },
   "devDependencies": {
+    "@eslint/js": "^10.0.1",
     "@pinia/testing": "^1.0.3",
     "@vitejs/plugin-vue": "^6.0.7",
     "@vitest/coverage-v8": "^4.1.7",
@@ -44,6 +45,7 @@
     "eslint-plugin-pinia": "^0.4.2",
     "eslint-plugin-prettier": "^5.5.5",
     "eslint-plugin-vue": "^10.9.1",
+    "globals": "^17.6.0",
     "happy-dom": "^20.9.0",
     "less": "^4.6.4",
     "postcss-html": "^1.8.1",
@@ -56,7 +58,9 @@
     "vite": "^8.0.13",
     "vitest": "^4.1.7"
   },
-  "overrides": { "glob":"12.0"},
+  "overrides": {
+    "glob": "12.0"
+  },
   "postcss": {
     "plugins": {
       "autoprefixer": {}

webapp/vite.config.mjs

@@ -60,11 +60,27 @@ export default defineConfig(({ command, mode }) => {
       chunkSizeWarningLimit: 400,
       rollupOptions: {
         output: {
-          manualChunks: {
+          manualChunks(id) {
-            "vue-vendor": ["vue", "pinia", "pinia-plugin-persistedstate"],
+            // Only split out third-party dependencies from node_modules
-            openseadragon: ["openseadragon"],
+            if (id.includes("node_modules")) {
-            uikit: ["uikit"],
+              if (id.includes("vue") || id.includes("pinia")) {
-            utils: ["axios", "mitt", "mousetrap", "@vueuse/core"],
+                return "vue-vendor";
+              }
+              if (id.includes("openseadragon")) {
+                return "openseadragon";
+              }
+              if (id.includes("uikit")) {
+                return "uikit";
+              }
+              if (
+                id.includes("axios") ||
+                id.includes("mitt") ||
+                id.includes("mousetrap") ||
+                id.includes("@vueuse")
+              ) {
+                return "utils";
+              }
+            }
           },
         },
       },

webapp/vitest.config.js

@@ -61,7 +61,7 @@ export default defineConfig({
       optimizer: {
         web: {
           enabled: true,
-          include: ["uikit", "openseadragon", "material-design-icons"],
+          include: ["uikit", "openseadragon", "material-symbols"],
         },
       },
     },