hack(ui): force preservation of tailwind plugins

Author: pujitm

unraid-ui/src/theme/import-hack.ts

@@ -0,0 +1,9 @@
+// Purpose: force vite to include these dependencies in the build output.
+// They don't show up when required, so the build will fail in CI. 
+// When imported as ESM, some combination of our dependencies causes the imports to err out at runtime 
+// and break tailwind config resolution.
+//
+// By adding these imports as side effects to the vite build, we can brute-force the desired behavior.
+// Once we have a better understanding of the root cause, and our dependencies have stabilized, we should remove this hack.
+import "@tailwindcss/typography";
+import "tailwindcss-animate";

unraid-ui/src/theme/preset.ts

@@ -1,7 +1,5 @@
 import type { Config } from "tailwindcss";
 import type { PluginAPI } from "tailwindcss/types/config";
-// import typography from "@tailwindcss/typography";
-// import animate from "tailwindcss-animate";
 
 export const unraidPreset = {
   darkMode: ['selector', '[data-mode="dark"]'],
@@ -241,5 +239,5 @@ export const unraidPreset = {
       }),
     },
   },
-  plugins: [require("@tailwindcss/typography"), require("tailwindcss-animate")],
+  plugins: [require('@tailwindcss/typography'), require('tailwindcss-animate')],
 } satisfies Partial<Config>; 

unraid-ui/vite.config.ts

@@ -34,6 +34,7 @@ export default function createConfig() {
           index: resolve(__dirname, 'src/index.ts'),
           tailwind: resolve(__dirname, 'tailwind.config.ts'),
           preset: resolve(__dirname, 'src/theme/preset.ts'),
+          importHack: resolve(__dirname, 'src/theme/import-hack.ts'),
         },
         preserveEntrySignatures: 'allow-extension',
         output: {