Optimize Vite configuration files (#23751)

js/apps/account-ui/package.json

@@ -32,6 +32,7 @@
     "@types/react": "^18.2.25",
     "@types/react-dom": "^18.2.11",
     "@vitejs/plugin-react-swc": "^3.4.0",
+    "lightningcss": "^1.22.0",
     "vite": "^4.4.10",
     "vite-plugin-checker": "^0.6.2"
   },

js/apps/account-ui/vite.config.ts

@@ -9,11 +9,10 @@ export default defineConfig({
     port: 8080,
   },
   build: {
-    target: "ES2022",
+    sourcemap: true,
-  },
+    target: "esnext",
-  resolve: {
+    modulePreload: false,
-    // Resolve the 'module' entrypoint at all times (not the default due to Node.js compatibility issues).
+    cssMinify: "lightningcss",
-    mainFields: ["module"],
   },
   plugins: [react(), checker({ typescript: true })],
 });

js/apps/admin-ui/package.json

@@ -104,6 +104,7 @@
     "cypress-axe": "^1.5.0",
     "jsdom": "^22.1.0",
     "ldap-server-mock": "^6.0.1",
+    "lightningcss": "^1.22.0",
     "ts-node": "^10.9.1",
     "uuid": "^9.0.1",
     "vite": "^4.4.10",

js/apps/admin-ui/vite.config.ts

@@ -10,17 +10,15 @@ export default defineConfig({
   },
   build: {
     sourcemap: true,
-    target: "ES2022",
+    target: "esnext",
-    // Code splitting results in broken CSS for production builds.
+    modulePreload: false,
-    // This is due to an unknown bug, presumably in Rollup.
+    cssMinify: "lightningcss",
-    // TODO: Revisit if we can re-enable this in the future.
-    cssCodeSplit: false,
   },
+  plugins: [react(), checker({ typescript: true })],
   resolve: {
     // Resolve the 'module' entrypoint at all times (not the default due to Node.js compatibility issues).
     mainFields: ["module"],
   },
-  plugins: [react(), checker({ typescript: true })],
   test: {
     setupFiles: "vitest.setup.ts",
     watch: false,

js/libs/keycloak-masthead/vite.config.ts

@@ -7,11 +7,8 @@ import dts from "vite-plugin-dts";
 
 // https://vitejs.dev/config/
 export default defineConfig({
-  resolve: {
-    mainFields: ["module"],
-  },
   build: {
-    target: "ES2022",
+    target: "esnext",
     lib: {
       entry: path.resolve(__dirname, "src/main.ts"),
       formats: ["es"],

js/libs/ui-shared/vite.config.ts

@@ -7,11 +7,8 @@ import dts from "vite-plugin-dts";
 
 // https://vitejs.dev/config/
 export default defineConfig({
-  resolve: {
-    mainFields: ["module"],
-  },
   build: {
-    target: "ES2022",
+    target: "esnext",
     lib: {
       entry: path.resolve(__dirname, "src/main.ts"),
       formats: ["es"],

js/pnpm-lock.yaml

@@ -132,9 +132,12 @@ importers:
       '@vitejs/plugin-react-swc':
         specifier: ^3.4.0
         version: 3.4.0(vite@4.4.10)
+      lightningcss:
+        specifier: ^1.22.0
+        version: 1.22.0
       vite:
         specifier: ^4.4.10
-        version: 4.4.10(@types/node@20.8.3)
+        version: 4.4.10(@types/node@20.8.3)(lightningcss@1.22.0)
       vite-plugin-checker:
         specifier: ^0.6.2
         version: 0.6.2(eslint@8.51.0)(typescript@5.2.2)(vite@4.4.10)
@@ -268,6 +271,9 @@ importers:
       ldap-server-mock:
         specifier: ^6.0.1
         version: 6.0.1
+      lightningcss:
+        specifier: ^1.22.0
+        version: 1.22.0
       ts-node:
         specifier: ^10.9.1
         version: 10.9.1(@types/node@20.8.3)(typescript@5.2.2)
@@ -276,13 +282,13 @@ importers:
         version: 9.0.1
       vite:
         specifier: ^4.4.10
-        version: 4.4.10(@types/node@20.8.3)
+        version: 4.4.10(@types/node@20.8.3)(lightningcss@1.22.0)
       vite-plugin-checker:
         specifier: ^0.6.2
         version: 0.6.2(eslint@8.51.0)(typescript@5.2.2)(vite@4.4.10)
       vitest:
         specifier: ^0.34.6
-        version: 0.34.6(jsdom@22.1.0)
+        version: 0.34.6(jsdom@22.1.0)(lightningcss@1.22.0)
 
   apps/keycloak-server:
     dependencies:
@@ -411,7 +417,7 @@ importers:
         version: 2.2.4(rollup@4.0.2)
       vite:
         specifier: ^4.4.10
-        version: 4.4.10(@types/node@20.8.3)
+        version: 4.4.10(@types/node@20.8.3)(lightningcss@1.22.0)
       vite-plugin-checker:
         specifier: ^0.6.2
         version: 0.6.2(eslint@8.51.0)(typescript@5.2.2)(vite@4.4.10)
@@ -451,7 +457,7 @@ importers:
         version: 2.2.4(rollup@4.0.2)
       vite:
         specifier: ^4.4.10
-        version: 4.4.10(@types/node@20.8.3)
+        version: 4.4.10(@types/node@20.8.3)(lightningcss@1.22.0)
       vite-plugin-checker:
         specifier: ^0.6.2
         version: 0.6.2(eslint@8.51.0)(typescript@5.2.2)(vite@4.4.10)
@@ -460,7 +466,7 @@ importers:
         version: 3.6.0(@types/node@20.8.3)(rollup@4.0.2)(typescript@5.2.2)(vite@4.4.10)
       vitest:
         specifier: ^0.34.6
-        version: 0.34.6(jsdom@22.1.0)
+        version: 0.34.6(jsdom@22.1.0)(lightningcss@1.22.0)
 
 packages:
 
@@ -1686,7 +1692,7 @@ packages:
       dom-accessibility-api: 0.5.16
       lodash: 4.17.21
       redent: 3.0.0
-      vitest: 0.34.6(jsdom@22.1.0)
+      vitest: 0.34.6(jsdom@22.1.0)(lightningcss@1.22.0)
     dev: true
 
   /@testing-library/react@14.0.0(react-dom@18.2.0)(react@18.2.0):
@@ -2173,7 +2179,7 @@ packages:
       vite: ^4
     dependencies:
       '@swc/core': 1.3.88
-      vite: 4.4.10(@types/node@20.8.3)
+      vite: 4.4.10(@types/node@20.8.3)(lightningcss@1.22.0)
     transitivePeerDependencies:
       - '@swc/helpers'
     dev: true
@@ -3258,6 +3264,12 @@ packages:
     engines: {node: '>=6'}
     dev: true
 
+  /detect-libc@1.0.3:
+    resolution: {integrity: sha512-pGjwhsmsp4kL2RTz08wcOlGN83otlqHeD/Z5T8GXZB+/YcpQ/dgo+lbU8ZsGxV0HIvqqxo9l7mqYwyYMD9bKDg==}
+    engines: {node: '>=0.10'}
+    hasBin: true
+    dev: true
+
   /diff-sequences@29.6.3:
     resolution: {integrity: sha512-EjePK1srD3P08o2j4f0ExnylqRs5B9tJjcp9t1krH2qRi8CCdsYfwe9JgSLurFBWwq4uOlipzfk5fHNvwFKr8Q==}
     engines: {node: ^14.15.0 || ^16.10.0 || >=18.0.0}
@@ -4961,6 +4973,104 @@ packages:
       type-check: 0.4.0
     dev: true
 
+  /lightningcss-darwin-arm64@1.22.0:
+    resolution: {integrity: sha512-aH2be3nNny+It5YEVm8tBSSdRlBVWQV8m2oJ7dESiYRzyY/E/bQUe2xlw5caaMuhlM9aoTMtOH25yzMhir0qPg==}
+    engines: {node: '>= 12.0.0'}
+    cpu: [arm64]
+    os: [darwin]
+    requiresBuild: true
+    dev: true
+    optional: true
+
+  /lightningcss-darwin-x64@1.22.0:
+    resolution: {integrity: sha512-9KHRFA0Y6mNxRHeoQMp0YaI0R0O2kOgUlYPRjuasU4d+pI8NRhVn9bt0yX9VPs5ibWX1RbDViSPtGJvYYrfVAQ==}
+    engines: {node: '>= 12.0.0'}
+    cpu: [x64]
+    os: [darwin]
+    requiresBuild: true
+    dev: true
+    optional: true
+
+  /lightningcss-freebsd-x64@1.22.0:
+    resolution: {integrity: sha512-xaYL3xperGwD85rQioDb52ozF3NAJb+9wrge3jD9lxGffplu0Mn35rXMptB8Uc2N9Mw1i3Bvl7+z1evlqVl7ww==}
+    engines: {node: '>= 12.0.0'}
+    cpu: [x64]
+    os: [freebsd]
+    requiresBuild: true
+    dev: true
+    optional: true
+
+  /lightningcss-linux-arm-gnueabihf@1.22.0:
+    resolution: {integrity: sha512-epQGvXIjOuxrZpMpMnRjK54ZqzhiHhCPLtHvw2fb6NeK2kK9YtF0wqmeTBiQ1AkbWfnnXGTstYaFNiadNK+StQ==}
+    engines: {node: '>= 12.0.0'}
+    cpu: [arm]
+    os: [linux]
+    requiresBuild: true
+    dev: true
+    optional: true
+
+  /lightningcss-linux-arm64-gnu@1.22.0:
+    resolution: {integrity: sha512-AArGtKSY4DGTA8xP8SDyNyKtpsUl1Rzq6FW4JomeyUQ4nBrR71uPChksTpj3gmWuGhZeRKLeCUI1DBid/zhChg==}
+    engines: {node: '>= 12.0.0'}
+    cpu: [arm64]
+    os: [linux]
+    requiresBuild: true
+    dev: true
+    optional: true
+
+  /lightningcss-linux-arm64-musl@1.22.0:
+    resolution: {integrity: sha512-RRraNgP8hnBPhInTTUdlFm+z16C/ghbxBG51Sw00hd7HUyKmEUKRozyc5od+/N6pOrX/bIh5vIbtMXIxsos0lg==}
+    engines: {node: '>= 12.0.0'}
+    cpu: [arm64]
+    os: [linux]
+    requiresBuild: true
+    dev: true
+    optional: true
+
+  /lightningcss-linux-x64-gnu@1.22.0:
+    resolution: {integrity: sha512-grdrhYGRi2KrR+bsXJVI0myRADqyA7ekprGxiuK5QRNkv7kj3Yq1fERDNyzZvjisHwKUi29sYMClscbtl+/Zpw==}
+    engines: {node: '>= 12.0.0'}
+    cpu: [x64]
+    os: [linux]
+    requiresBuild: true
+    dev: true
+    optional: true
+
+  /lightningcss-linux-x64-musl@1.22.0:
+    resolution: {integrity: sha512-t5f90X+iQUtIyR56oXIHMBUyQFX/zwmPt72E6Dane3P8KNGlkijTg2I75XVQS860gNoEFzV7Mm5ArRRA7u5CAQ==}
+    engines: {node: '>= 12.0.0'}
+    cpu: [x64]
+    os: [linux]
+    requiresBuild: true
+    dev: true
+    optional: true
+
+  /lightningcss-win32-x64-msvc@1.22.0:
+    resolution: {integrity: sha512-64HTDtOOZE9PUCZJiZZQpyqXBbdby1lnztBccnqh+NtbKxjnGzP92R2ngcgeuqMPecMNqNWxgoWgTGpC+yN5Sw==}
+    engines: {node: '>= 12.0.0'}
+    cpu: [x64]
+    os: [win32]
+    requiresBuild: true
+    dev: true
+    optional: true
+
+  /lightningcss@1.22.0:
+    resolution: {integrity: sha512-+z0qvwRVzs4XGRXelnWRNwqsXUx8k3bSkbP8vD42kYKSk3z9OM2P3e/gagT7ei/gwh8DTS80LZOFZV6lm8Z8Fg==}
+    engines: {node: '>= 12.0.0'}
+    dependencies:
+      detect-libc: 1.0.3
+    optionalDependencies:
+      lightningcss-darwin-arm64: 1.22.0
+      lightningcss-darwin-x64: 1.22.0
+      lightningcss-freebsd-x64: 1.22.0
+      lightningcss-linux-arm-gnueabihf: 1.22.0
+      lightningcss-linux-arm64-gnu: 1.22.0
+      lightningcss-linux-arm64-musl: 1.22.0
+      lightningcss-linux-x64-gnu: 1.22.0
+      lightningcss-linux-x64-musl: 1.22.0
+      lightningcss-win32-x64-msvc: 1.22.0
+    dev: true
+
   /lilconfig@2.1.0:
     resolution: {integrity: sha512-utWOt/GHzuUxnLKxB6dk81RoOeoNeHgbrXiuGk4yyF5qlRz+iIVWu56E2fqGHFrXz0QNUhLB/8nKqvRH66JKGQ==}
     engines: {node: '>=10'}
@@ -6813,7 +6923,7 @@ packages:
       extsprintf: 1.4.1
     dev: true
 
-  /vite-node@0.34.6(@types/node@20.8.3):
+  /vite-node@0.34.6(@types/node@20.8.3)(lightningcss@1.22.0):
     resolution: {integrity: sha512-nlBMJ9x6n7/Amaz6F3zJ97EBwR2FkzhBRxF5e+jE6LA3yi6Wtc2lyTij1OnDMIr34v5g/tVQtsVAzhT0jc5ygA==}
     engines: {node: '>=v14.18.0'}
     hasBin: true
@@ -6823,7 +6933,7 @@ packages:
       mlly: 1.4.1
       pathe: 1.1.1
       picocolors: 1.0.0
-      vite: 4.4.10(@types/node@20.8.3)
+      vite: 4.4.10(@types/node@20.8.3)(lightningcss@1.22.0)
     transitivePeerDependencies:
       - '@types/node'
       - less
@@ -6881,7 +6991,7 @@ packages:
       strip-ansi: 6.0.1
       tiny-invariant: 1.3.1
       typescript: 5.2.2
-      vite: 4.4.10(@types/node@20.8.3)
+      vite: 4.4.10(@types/node@20.8.3)(lightningcss@1.22.0)
       vscode-languageclient: 7.0.0
       vscode-languageserver: 7.0.0
       vscode-languageserver-textdocument: 1.0.8
@@ -6904,7 +7014,7 @@ packages:
       debug: 4.3.4(supports-color@8.1.1)
       kolorist: 1.8.0
       typescript: 5.2.2
-      vite: 4.4.10(@types/node@20.8.3)
+      vite: 4.4.10(@types/node@20.8.3)(lightningcss@1.22.0)
       vue-tsc: 1.8.8(typescript@5.2.2)
     transitivePeerDependencies:
       - '@types/node'
@@ -6912,7 +7022,7 @@ packages:
       - supports-color
     dev: true
 
-  /vite@4.4.10(@types/node@20.8.3):
+  /vite@4.4.10(@types/node@20.8.3)(lightningcss@1.22.0):
     resolution: {integrity: sha512-TzIjiqx9BEXF8yzYdF2NTf1kFFbjMjUSV0LFZ3HyHoI3SGSPLnnFUKiIQtL3gl2AjHvMrprOvQ3amzaHgQlAxw==}
     engines: {node: ^14.18.0 || >=16.0.0}
     hasBin: true
@@ -6942,13 +7052,14 @@ packages:
     dependencies:
       '@types/node': 20.8.3
       esbuild: 0.18.20
+      lightningcss: 1.22.0
       postcss: 8.4.28
       rollup: 3.29.4
     optionalDependencies:
       fsevents: 2.3.3
     dev: true
 
-  /vitest@0.34.6(jsdom@22.1.0):
+  /vitest@0.34.6(jsdom@22.1.0)(lightningcss@1.22.0):
     resolution: {integrity: sha512-+5CALsOvbNKnS+ZHMXtuUC7nL8/7F1F2DnHGjSsszX8zCjWSSviphCb/NuS9Nzf4Q03KyyDRBAXhF/8lffME4Q==}
     engines: {node: '>=v14.18.0'}
     hasBin: true
@@ -7001,8 +7112,8 @@ packages:
       strip-literal: 1.3.0
       tinybench: 2.5.0
       tinypool: 0.7.0
-      vite: 4.4.10(@types/node@20.8.3)
+      vite: 4.4.10(@types/node@20.8.3)(lightningcss@1.22.0)
-      vite-node: 0.34.6(@types/node@20.8.3)
+      vite-node: 0.34.6(@types/node@20.8.3)(lightningcss@1.22.0)
       why-is-node-running: 2.2.2
     transitivePeerDependencies:
       - less