From 2130aa0d688a9c80d987d487472ff14f3e40f265 Mon Sep 17 00:00:00 2001
From: Ulf Gebhardt <ulf.gebhardt@webcraft-media.de>
Date: Fri, 31 Oct 2025 16:36:51 +0100
Subject: [PATCH] fix(webapp): always link compiled styleguide (#8998)

---
 webapp/jsconfig.json         |  2 +-
 webapp/nuxt.config.js        | 12 +++++++++---
 webapp/plugins/styleguide.js |  3 ++-
 3 files changed, 12 insertions(+), 5 deletions(-)

diff --git a/webapp/jsconfig.json b/webapp/jsconfig.json
index e0a8c20d7..3262e19d2 100644
--- a/webapp/jsconfig.json
+++ b/webapp/jsconfig.json
@@ -15,7 +15,7 @@
         "*"
       ],
       "@@/*": [
-        "../styleguide/src/system/*"
+        "../styleguide/dist/system.umd.min.js"
       ],
     }
   }
diff --git a/webapp/nuxt.config.js b/webapp/nuxt.config.js
index c6828d175..edade8f62 100644
--- a/webapp/nuxt.config.js
+++ b/webapp/nuxt.config.js
@@ -6,8 +6,9 @@ const CONFIG = require('./config').default // we need to use require since this
 
 const styleguidePath = '../styleguide'
 const styleguideStyles = [
-  `${styleguidePath}/src/system/styles/main.scss`,
-  `${styleguidePath}/src/system/styles/shared.scss`,
+  // `${styleguidePath}/src/system/styles/main.scss`,
+  // `${styleguidePath}/src/system/styles/shared.scss`,
+  `${styleguidePath}/dist/shared.scss`,
 ]
 
 export default {
@@ -256,6 +257,11 @@ export default {
           : `[contenthash:7]${isModern ? '.modern' : ''}_${CONFIG.VERSION}.js`,
       css: ({ isDev }) => (isDev ? '[name].css' : `css/[contenthash:7]_${CONFIG.VERSION}.css`),
     },
+    // babel config
+    babel: {
+      // To prevent  ERROR  [BABEL] Note: The code generator has deoptimised the styling of [..] as it exceeds the max of 500KB.
+      compact: true,
+    },
     /*
      ** You can extend webpack config here
      */
@@ -272,7 +278,7 @@ export default {
         config.devtool = 'source-map'
       }
 
-      config.resolve.alias['@@'] = path.resolve(__dirname, `${styleguidePath}/src/system`)
+      config.resolve.alias['@@'] = path.resolve(__dirname, `${styleguidePath}/dist`)
       config.module.rules.push({
         resourceQuery: /blockType=docs/,
         loader: require.resolve(`${styleguidePath}/src/loader/docs-trim-loader.js`),
diff --git a/webapp/plugins/styleguide.js b/webapp/plugins/styleguide.js
index 5d632687b..96fac5041 100644
--- a/webapp/plugins/styleguide.js
+++ b/webapp/plugins/styleguide.js
@@ -1,4 +1,5 @@
 import Vue from 'vue'
-import Styleguide from '@@/'
+import Styleguide from '@@/system.umd.min.js'
+import '@@/system.css'
 
 Vue.use(Styleguide)