Cleanups

integrations/vite/solidstart.test.ts

@@ -0,0 +1,69 @@
+import { expect } from 'vitest'
+import { candidate, html, json, test, ts } from '../utils'
+
+test(
+  'production build',
+  {
+    fs: {
+      'package.json': json`
+        {
+          "type": "module",
+          "dependencies": {
+            "vue": "^3.4.37",
+            "tailwindcss": "workspace:^"
+          },
+          "devDependencies": {
+            "@vitejs/plugin-vue": "^5.1.2",
+            "@tailwindcss/vite": "workspace:^",
+            "vite": "^5.3.5"
+          }
+        }
+      `,
+      'vite.config.ts': ts`
+        import { defineConfig } from 'vite'
+        import vue from '@vitejs/plugin-vue'
+        import tailwindcss from '@tailwindcss/vite'
+
+        export default defineConfig({
+          plugins: [vue(), tailwindcss()],
+        })
+      `,
+      'index.html': html`
+        <!doctype html>
+        <html>
+          <body>
+            <div id="app"></div>
+            <script type="module" src="./src/main.ts"></script>
+          </body>
+        </html>
+      `,
+      'src/main.ts': ts`
+        import { createApp } from 'vue'
+        import App from './App.vue'
+
+        createApp(App).mount('#app')
+      `,
+      'src/App.vue': html`
+        <style>
+          @import 'tailwindcss/utilities';
+          @import 'tailwindcss/theme' theme(reference);
+          .foo {
+            @apply text-red-500;
+          }
+        </style>
+
+        <template>
+          <div class="underline foo">Hello Vue!</div>
+        </template>
+      `,
+    },
+  },
+  async ({ fs, exec }) => {
+    await exec('pnpm vite build')
+
+    let files = await fs.glob('dist/**/*.css')
+    expect(files).toHaveLength(1)
+
+    await fs.expectFileToContain(files[0][0], [candidate`underline`, candidate`foo`])
+  },
+)

packages/@tailwindcss-vite/src/index.ts

@@ -26,12 +26,6 @@ export default function tailwindcss(): Plugin[] {
 
   let roots: Map<string, Root> = new Map()
 
-  // Since new roots can be added at any time, we need to keep track of every
-  // potential candidate file that was referenced before a root was created. To
-  // save memory, this will store the path so we can read the latest version
-  // from the disk and don't need to keep it in memory.
-  let candidatePaths = new Set<string>()
-
   // The Vite extension has two types of sources for candidates:
   //
   // 1. The module graph: These are all modules that vite transforms and we want
@@ -182,13 +176,6 @@ export default function tailwindcss(): Plugin[] {
         this.candidates.add(candidate)
       }
 
-      // Seed the candidate cache with candidates from all known candidate paths
-      for (let candidate of this.scanner.scanFiles(
-        [...candidatePaths.values()].map((path) => ({ file: path, extension: getExtension(path) })),
-      )) {
-        this.candidates.add(candidate)
-      }
-
       // Watch individual files found via custom `@source` paths
       for (let file of this.scanner.files) {
         addWatchFile(file)
@@ -354,6 +341,7 @@ export default function tailwindcss(): Plugin[] {
       async transform(src, id, options) {
         if (!isPotentialCssRootFile(id)) return
 
+        // TODO: Use DefaultMap
         let root = roots.get(id)
         if (!root) {
           root = new Root(id)
@@ -392,6 +380,7 @@ export default function tailwindcss(): Plugin[] {
       async transform(src, id) {
         if (!isPotentialCssRootFile(id)) return
 
+        // TODO: Use DefaultMap
         let root = roots.get(id)
         if (!root) {
           root = new Root(id)
@@ -459,7 +448,10 @@ function isCssRootFile(content: string) {
     content.includes('@tailwind') ||
     content.includes('@config') ||
     content.includes('@plugin') ||
-    content.includes('@apply')
+    content.includes('@apply') ||
+    content.includes('@theme') ||
+    content.includes('@variant') ||
+    content.includes('@utility')
   )
 }