fix: add tailwindcss types (#462)

Author: yassilah

package.json

@@ -28,6 +28,7 @@
   "dependencies": {
     "@nuxt/kit": "npm:@nuxt/kit-edge@latest",
     "@nuxt/postcss8": "^1.1.3",
+    "@types/tailwindcss": "^3.0.10",
     "autoprefixer": "^10.4.2",
     "chalk": "^4.1.2",
     "clear-module": "^4.1.2",

playground/app.vue

@@ -9,6 +9,6 @@
   </div>
 </template>
 
-<script setup>
+<script setup lang="ts">
 import tailwindConfig from '#tailwind-config'
 </script>

src/module.ts

@@ -71,12 +71,17 @@ export default defineNuxtModule({
     // Expose resolved tailwind config as an alias
     // https://tailwindcss.com/docs/configuration/#referencing-in-javascript
     if (moduleOptions.exposeConfig) {
-      const resolveConfig = await import('tailwindcss/resolveConfig.js').then(r => r.default || r)
+      const resolveConfig = await import('tailwindcss/resolveConfig.js').then(r => r.default || r) as any
       const resolvedConfig = resolveConfig(tailwindConfig)
       const template = addTemplate({
         filename: 'tailwind.config.mjs',
         getContents: () => `export default ${JSON.stringify(resolvedConfig, null, 2)}`
       })
+      addTemplate({
+        filename: 'tailwind.config.d.ts',
+        getContents: () => 'declare const config: import("tailwindcss/tailwind-config").TailwindConfig\nexport { config as default }',
+        write: true
+      })
       nuxt.options.alias['#tailwind-config'] = template.dst
     }
 
@@ -122,9 +127,9 @@ export default defineNuxtModule({
       }
       addServerMiddleware({ path, handler: viewerDevMiddleware })
       nuxt.hook('listen', (_, listener) => {
-        const fullPath = `${withoutTrailingSlash(listener.url)}${path}`;
-        logger.info(`Tailwind Viewer: ${chalk.underline.yellow(fullPath)}`);
-      });
+        const fullPath = `${withoutTrailingSlash(listener.url)}${path}`
+        logger.info(`Tailwind Viewer: ${chalk.underline.yellow(fullPath)}`)
+      })
     }
   }
 })

tsconfig.json

@@ -1,12 +1,3 @@
 {
-  "extends": "./playground/.nuxt/tsconfig.json",
-  "compilerOptions": {
-    "baseUrl": ".",
-    "moduleResolution": "Node",
-    "esModuleInterop": true,
-    "resolveJsonModule": true,
-    "types": [
-      "node"
-    ]
-  }
+  "extends": "./playground/.nuxt/tsconfig.json"
 }

yarn.lock

@@ -815,6 +815,11 @@
   dependencies:
     "@types/node" "*"
 
+"@types/tailwindcss@^3.0.10":
+  version "3.0.10"
+  resolved "https://registry.yarnpkg.com/@types/tailwindcss/-/tailwindcss-3.0.10.tgz#cd54bad9c00b4823e9e33c67af585347f235aa11"
+  integrity sha512-1UnZIHO0NOPyPlPFV0HuMjki2SHkvG9uBA1ZehWj/OQMSROk503nuNyyfmJSIT289yewxTbKoPG+KLxYRvfIIg==
+
 "@types/tough-cookie@*":
   version "4.0.1"
   resolved "https://registry.yarnpkg.com/@types/tough-cookie/-/tough-cookie-4.0.1.tgz#8f80dd965ad81f3e1bc26d6f5c727e132721ff40"