fix: check for non-resolved tailwind.config

ineshbose · ineshbose · commit c448158c358b · 2025-01-14T08:35:12.000Z
diff --git a/docs/app/components/AppHeader.vue b/docs/app/components/AppHeader.vue
@@ -11,11 +11,18 @@ const { header } = useAppConfig()
     <template #logo>
       <TheLogo class="h-6" />
       <TailwindText class="h-4" />
-       <UTooltip v-if="header.pkgVersion" :text="`Latest release: v${header.pkgVersion}`">
-            <UBadge variant="subtle" size="xs" class="-mb-[2px] rounded font-semibold">
-              v{{ header.pkgVersion.match(/[0-9]+\.[0-9]+/)[0] }}
-            </UBadge>
-          </UTooltip>
+      <UTooltip
+        v-if="header.pkgVersion"
+        :text="`Latest release: v${header.pkgVersion}`"
+      >
+        <UBadge
+          variant="subtle"
+          size="xs"
+          class="-mb-[2px] rounded font-semibold"
+        >
+          v{{ header.pkgVersion.match(/[0-9]+\.[0-9]+/)[0] }}
+        </UBadge>
+      </UTooltip>
     </template>
 
     <template
diff --git a/docs/app/components/TailwindText.vue b/docs/app/components/TailwindText.vue
@@ -1,5 +1,8 @@
 <template>
-  <svg xmlns="https://www.w3.org/2000/svg" viewBox="0 0 377.44 55.32">
+  <svg
+    xmlns="https://www.w3.org/2000/svg"
+    viewBox="0 0 377.44 55.32"
+  >
     <path
       fill="currentColor"
       d="M24.12,24.87H14.89V42.73c0,4.77,3.13,4.69,9.23,4.4v7.22C11.76,55.84,6.85,52.41,6.85,42.73V24.87H0V17.12H6.85v-10l8-2.38V17.12h9.23Zm35.19-7.75h8V54.35h-8V49c-2.83,3.94-7.22,6.33-13,6.33-10.12,0-18.53-8.57-18.53-19.58s8.41-19.58,18.54-19.58c5.8,0,10.2,2.38,13,6.25ZM47.55,47.65A11.5,11.5,0,0,0,59.31,35.74,11.5,11.5,0,0,0,47.55,23.83,11.5,11.5,0,0,0,35.79,35.74,11.5,11.5,0,0,0,47.55,47.65ZM80.76,11.54A5.2,5.2,0,0,1,75.62,6.4a5.14,5.14,0,1,1,10.27,0A5.19,5.19,0,0,1,80.76,11.54Zm-4,42.81V17.12h8V54.35Zm17.34,0V0h8V54.35Zm60.23-37.23h8.49L151.11,54.35h-7.89l-7.75-25.09-7.81,25.09h-7.89L108.08,17.12h8.49l7.22,25.69,7.81-25.69h7.67L147,42.81Zm18.47-5.58a5.2,5.2,0,0,1-5.14-5.14,5.14,5.14,0,1,1,10.27,0A5.19,5.19,0,0,1,172.78,11.54Zm-4,42.81V17.12h8V54.35Zm36.92-38.2c8.34,0,14.3,5.66,14.3,15.34V54.35h-8v-22c0-5.66-3.28-8.63-8.34-8.63-5.29,0-9.46,3.12-9.46,10.72v20h-8V17.12h8v4.77c2.46-3.87,6.48-5.74,11.54-5.74ZM258.1,2.23h8V54.35h-8V49c-2.83,3.94-7.23,6.33-13,6.33-10.13,0-18.54-8.57-18.54-19.58s8.41-19.58,18.54-19.58c5.8,0,10.2,2.38,13,6.25ZM246.33,47.65a11.5,11.5,0,0,0,11.76-11.91,11.76,11.76,0,1,0-23.52,0A11.5,11.5,0,0,0,246.33,47.65Zm46.76,7.67a19.26,19.26,0,0,1-19.66-19.58,19.2,19.2,0,0,1,19.66-19.58,18.39,18.39,0,0,1,16.6,9.6l-6.93,4c-1.63-3.5-5.28-5.73-9.75-5.73a11.36,11.36,0,0,0-11.54,11.69A11.35,11.35,0,0,0,293,47.42a10.9,10.9,0,0,0,9.9-5.73l6.93,4a18.73,18.73,0,0,1-16.75,9.68Zm30-27.92c0,6.77,20,2.68,20,16.45,0,7.45-6.48,11.47-14.52,11.47-7.45,0-12.81-3.35-15.19-8.71l6.92-4c1.2,3.35,4.17,5.36,8.27,5.36,3.57,0,6.33-1.19,6.33-4.17,0-6.63-20-2.91-20-16.23,0-7,6-11.39,13.62-11.39,6.11,0,11.17,2.83,13.78,7.74l-6.78,3.8a7.25,7.25,0,0,0-7-4.25c-2.9,0-5.43,1.27-5.43,3.95Zm34.32,0c0,6.77,20,2.68,20,16.45,0,7.45-6.48,11.47-14.52,11.47-7.45,0-12.81-3.35-15.19-8.71l6.92-4c1.2,3.35,4.17,5.36,8.27,5.36,3.57,0,6.33-1.19,6.33-4.17,0-6.63-20-2.91-20-16.23,0-7,6-11.39,13.62-11.39C369,16.16,374,19,376.62,23.9l-6.78,3.8a7.24,7.24,0,0,0-7-4.25c-2.91,0-5.44,1.27-5.44,3.95Z"
diff --git a/docs/app/components/content/Sandbox.vue b/docs/app/components/content/Sandbox.vue
@@ -1,6 +1,6 @@
 <script setup lang="ts">
 const props = defineProps({
-  src: { type: String, default: 'main' }
+  src: { type: String, default: 'main' },
 })
 
 const colorMode = useColorMode()
@@ -16,7 +16,7 @@ const colorMode = useColorMode()
         class="w-full h-full min-h-[700px] overflow-hidden bg-gray-100 dark:bg-gray-800"
       />
     </div>
-    
+
     <span class="text-sm text-gray-500 dark:text-gray-400">
       Open in <NuxtLink
         :to="`https://github.com/nuxt-modules/tailwindcss/tree/${props.src}`"
diff --git a/docs/nuxt.config.ts b/docs/nuxt.config.ts
@@ -10,9 +10,29 @@ export default defineNuxtConfig({
     '@nuxthq/studio',
     'nuxt-og-image',
   ],
+  // Devtools / Typescript
+  devtools: { enabled: true },
   ui: {
     icons: ['heroicons', 'simple-icons', 'ph'],
   },
+  alias: {
+    '@nuxtjs/tailwindcss': '../src/module',
+  },
+  routeRules: {
+    '/getting-started': { redirect: '/getting-started/installation' },
+    '/tailwind': { redirect: '/tailwind/config' },
+    '/examples': { redirect: '/examples/basic' },
+    '/api/search.json': { prerender: true },
+  },
+  future: { compatibilityVersion: 4 },
+
+  compatibilityDate: '2024-07-11',
+  nitro: {
+    prerender: {
+      routes: ['/'],
+    },
+  },
+  typescript: { strict: false },
   // Fonts
   fontMetrics: {
     fonts: ['DM Sans'],
@@ -24,24 +44,4 @@ export default defineNuxtConfig({
       'DM+Sans': [400, 500, 600, 700],
     },
   },
-  nitro: {
-    prerender: {
-      routes: ['/'],
-    },
-  },
-  routeRules: {
-    '/getting-started': { redirect: '/getting-started/installation' },
-    '/tailwind': { redirect: '/tailwind/config' },
-    '/examples': { redirect: '/examples/basic' },
-    '/api/search.json': { prerender: true },
-  },
-  // Devtools / Typescript
-  devtools: { enabled: true },
-  typescript: { strict: false },
-  alias: {
-    '@nuxtjs/tailwindcss': '../src/module',
-  },
-
-  compatibilityDate: '2024-07-11',
-  future: { compatibilityVersion: 4 },
 })
diff --git a/playground/modules/resolved.ts b/playground/modules/resolved.ts
@@ -12,10 +12,10 @@ export default defineNuxtModule({
       oldConfig
         ? setTimeout(() => updateTemplates({ filter: t => t.filename === 'resolved-config.cjs' }), 100)
         : addTemplate({
-          filename: 'resolved-config.cjs',
-          getContents: () => `module.exports = /* ${counter++}, ${Boolean(oldConfig)} */ ${JSON.stringify(config, null, 2)}`,
-          write: true,
-        }),
+            filename: 'resolved-config.cjs',
+            getContents: () => `module.exports = /* ${counter++}, ${Boolean(oldConfig)} */ ${JSON.stringify(config, null, 2)}`,
+            write: true,
+          }),
     )
 
     // const template = addTemplate({
diff --git a/playground/nuxt.config.ts b/playground/nuxt.config.ts
@@ -17,13 +17,20 @@ export default defineNuxtConfig({
     '@nuxt/content',
   ],
 
-  tailwindcss: {
-    // viewer: false,
-    config: {},
-    exposeConfig: true,
-    cssPath: '~/assets/css/tailwind.css',
-    editorSupport: true,
-  } satisfies Partial<ModuleOptions>,
+  css: [
+    // Including Inter CSS is the first component to reproduce HMR issue. It also causes playground to look better,
+    // since Inter is a native font for Tailwind UI
+    '@fontsource/inter/400.css',
+    '@fontsource/inter/500.css',
+    '@fontsource/inter/600.css',
+    '@fontsource/inter/700.css',
+  ],
+
+  content: {
+    documentDriven: true,
+  },
+
+  compatibilityDate: '2024-07-11',
 
   hooks: {
     'tailwindcss:loadConfig': (config, configPath, idx) => {
@@ -61,18 +68,11 @@ export default defineNuxtConfig({
     },
   } satisfies Partial<ModuleHooks>,
 
-  content: {
-    documentDriven: true,
-  },
-
-  css: [
-    // Including Inter CSS is the first component to reproduce HMR issue. It also causes playground to look better,
-    // since Inter is a native font for Tailwind UI
-    '@fontsource/inter/400.css',
-    '@fontsource/inter/500.css',
-    '@fontsource/inter/600.css',
-    '@fontsource/inter/700.css',
-  ],
-
-  compatibilityDate: '2024-07-11',
+  tailwindcss: {
+    // viewer: false,
+    config: {},
+    exposeConfig: true,
+    cssPath: '~/assets/css/tailwind.css',
+    editorSupport: true,
+  } satisfies Partial<ModuleOptions>,
 })
diff --git a/src/internal-context/load.ts b/src/internal-context/load.ts
@@ -108,7 +108,7 @@ const createInternalContext = async (moduleOptions: ModuleOptions, nuxt = useNux
     const thenCallHook = async (resolvedConfig: ResolvedConfig) => {
       const { configFile: resolvedConfigFile } = resolvedConfig
       if (!resolvedConfigFile || !resolvedConfig.config) {
-        return resolvedConfig
+        return { ...resolvedConfig, configFile: resolvedConfigFile === 'tailwind.config' ? undefined : resolvedConfigFile }
       }
 
       const config = configMerger(undefined, resolvedConfig.config)
@@ -170,7 +170,7 @@ const createInternalContext = async (moduleOptions: ModuleOptions, nuxt = useNux
                 (_, v) => typeof v === 'function' ? `() => (${JSON.stringify(v())})` : v,
               ).replace(/"(\(\) => \(.*\))"/g, (_, substr) => substr.replace(/\\"/g, '"'))
 
-            const layerConfigs = resolvedConfigsCtx.use().map((c, idx): [string | null, string | null] => c?.configFile ? [`import cfg${idx} from ${JSON.stringify(/[/\\]node_modules[/\\]/.test(c.configFile) ? c.configFile : './' + relative(targetDir, c.configFile))}`, configUpdatedHook[c.configFile] ? `(() => {const cfg=configMerger(undefined, cfg${idx});${configUpdatedHook[c.configFile]};return cfg;})()` : `cfg${idx}`] : [null, c && serializeConfig(c.config)])
+            const layerConfigs = resolvedConfigsCtx.use().map((c, idx): [string | null, string | null] => c?.configFile ? [`import cfg${idx} from ${JSON.stringify(/[/\\]node_modules[/\\]/.test(c.configFile) ? c.configFile : './' + relative(targetDir, c.configFile))}`, configUpdatedHook[c.configFile] ? `(() => {const cfg=configMerger(undefined, cfg${idx});${configUpdatedHook[c.configFile]};return cfg;})()` : `cfg${idx}`] : [null, c?.config ? serializeConfig(c.config) : null])
 
             return [
               `// generated by the @nuxtjs/tailwindcss <https://github.com/nuxt-modules/tailwindcss> module at ${(new Date()).toLocaleString()}`,
diff --git a/test/fixtures/basic/nuxt.config.ts b/test/fixtures/basic/nuxt.config.ts
@@ -1,10 +1,10 @@
 import { resolve } from 'node:path'
 
 export default defineNuxtConfig({
-  alias: {
-    '@nuxtjs/tailwindcss': resolve(__dirname, '../../../src/module.ts'),
-  },
   modules: [
     '@nuxtjs/tailwindcss',
   ],
+  alias: {
+    '@nuxtjs/tailwindcss': resolve(__dirname, '../../../src/module.ts'),
+  },
 })
