web: build polyfills into separate file, load first

Signed-off-by: Jens Langhammer <jens.langhammer@beryju.org>

web/rollup.config.js

@@ -25,10 +25,6 @@ const resources = [
 const isProdBuild = process.env.NODE_ENV === "production";
 // eslint-disable-next-line @typescript-eslint/explicit-module-boundary-types
 function manualChunks(id) {
-    if (id.includes("construct-style-sheets-polyfill")) {
-        // Keep polyfills in the main file so they are loaded when dependencies are loaded
-        return "vendor-poly";
-    }
     if (id.includes("node_modules")) {
         if (id.includes("codemirror")) {
             return "vendor-cm";
@@ -63,6 +59,33 @@ export default [
             clearScreen: false,
         },
     },
+    // Polyfills (imported first)
+    {
+        input: [
+            "construct-style-sheets-polyfill"
+        ],
+        output: [
+            {
+                format: "es",
+                dir: "dist",
+                sourcemap: true,
+            }
+        ],
+        plugins: [
+            cssimport(),
+            typescript(),
+            externalGlobals({
+                django: "django",
+            }),
+            resolve({ browser: true }),
+            commonjs(),
+            sourcemaps(),
+            isProdBuild && terser(),
+        ].filter(p => p),
+        watch: {
+            clearScreen: false,
+        },
+    },
     // Main Application
     {
         input: "./src/interfaces/AdminInterface.ts",