From 16ee08465e2a1f204dc613a7d81e934a5bd27669 Mon Sep 17 00:00:00 2001
From: Qingyu Wang <qingyu.wang@aliyun.com>
Date: Sat, 9 Nov 2024 17:50:32 +0800
Subject: [PATCH] feat: support zero-configuration

If no `tailwind.config.js` is provided, we will create a empty
configuration with only `content` that contains all the modules in the
module graph.

This should allow using this plugin with zero-configuration.
---
 src/TailwindCSSRspackPlugin.ts | 12 ++++++++++--
 test/config/index.test.ts      | 28 ++++++++++++++++++++++++++++
 2 files changed, 38 insertions(+), 2 deletions(-)

diff --git a/src/TailwindCSSRspackPlugin.ts b/src/TailwindCSSRspackPlugin.ts
index bd4296a..875d36b 100644
--- a/src/TailwindCSSRspackPlugin.ts
+++ b/src/TailwindCSSRspackPlugin.ts
@@ -1,3 +1,4 @@
+import { existsSync } from 'node:fs';
 import { mkdtemp, writeFile } from 'node:fs/promises';
 import { tmpdir } from 'node:os';
 import path from 'node:path';
@@ -196,13 +197,20 @@ class TailwindRspackPluginImpl {
 
     const configPath = path.resolve(outputDir, 'tailwind.config.mjs');
 
+    const content = JSON.stringify(Array.from(entryModules));
+
     await writeFile(
       configPath,
-      `\
+      existsSync(userConfig)
+        ? `\
 import config from '${pathToFileURL(userConfig)}'
 export default {
   ...config,
-  content: ${JSON.stringify(Array.from(entryModules))}
+  content: ${content}
+}`
+        : `\
+export default {
+  content: ${content}
 }`,
     );
 
diff --git a/test/config/index.test.ts b/test/config/index.test.ts
index c058ca1..169b442 100644
--- a/test/config/index.test.ts
+++ b/test/config/index.test.ts
@@ -69,3 +69,31 @@ test('should build with absolute config', async ({ page }) => {
 
   await server.close();
 });
+
+test('should build without tailwind.config.js', async ({ page }) => {
+  const rsbuild = await createRsbuild({
+    cwd: __dirname,
+    rsbuildConfig: {
+      plugins: [pluginTailwindCSS()],
+    },
+  });
+
+  await rsbuild.build();
+  const { server, urls } = await rsbuild.preview();
+
+  await page.goto(urls[0]);
+
+  const display = await page.evaluate(() => {
+    const el = document.getElementById('test');
+
+    if (!el) {
+      throw new Error('#test not found');
+    }
+
+    return window.getComputedStyle(el).getPropertyValue('display');
+  });
+
+  expect(display).toBe('flex');
+
+  await server.close();
+});