feat: improve it for tailwind v1

Author: ph1p

README.md

@@ -1,31 +1,10 @@
 # Tailwind CSS Linter (CLI)
 
-A command-line tool that uses the Tailwind CSS IntelliSense engine to lint your Tailwind classes.
+[![](https://img.shields.io/badge/Tailwind%20CSS%20Linter-v1.0.0-blue)](https://www.npmjs.com/package/tailwind-lint) ![](https://github.com/ph1p/tailwind-lint/actions/workflows/ci.yml/badge.svg) ![](https://github.com/ph1p/tailwind-lint/actions/workflows/release.yml/badge.svg)
 
+It just lints your Tailwind project as the IDE will do, just on the command line.
 Supports **Tailwind CSS v4** (CSS-based config) and **v3** (JavaScript config, legacy).
 
-## Features
-
-**Core (v3 & v4):**
-- CSS Conflicts - Detects when multiple classes apply the same CSS properties
-- Invalid @apply Usage - Validates if a class can be used with `@apply`
-- Invalid @screen References - Detects references to non-existent breakpoints
-- Invalid Config Paths - Validates references in `config()` and `theme()` functions
-- Invalid @tailwind Directives - Validates `@tailwind` layer values
-- Recommended Variant Order - Suggests preferred ordering of variants
-- Blocklisted Classes - Detects usage of blocklisted classes
-- Autofix - Automatically fix issues with `--fix` flag
-
-**v4-Specific:**
-- Canonical Class Suggestions - Suggests shorthand equivalents for arbitrary values (e.g., `top-[60px]` → `top-15`)
-- Invalid @source Directives - Validates `@source` directive paths
-- Full theme loading - Automatically loads Tailwind's default theme
-
-## Requirements
-
-- Node.js >= 22.0.0
-- Tailwind CSS v4 or v3 (installed in your project)
-
 ## Installation
 
 ```bash
@@ -45,6 +24,9 @@ pnpm dlx tailwind-lint "src/**/*.html"
 ## Usage
 
 ```bash
+# fastest way to lint and fix issues
+npx tailwind-lint --auto --fix
+
 tailwind-lint [options] [files...]
 ```
 
@@ -141,50 +123,22 @@ Use `--fix` to automatically resolve issues:
 
 Files are written atomically with multiple iterations to ensure all fixes are applied. The autofix process has a safety limit of 100 iterations per file to prevent infinite loops.
 
-## Output Examples
-
-**Issues found:**
-```
-src/example.html
-  10:8   warning  'p-4' applies the same CSS properties as 'px-8'  (cssConflict)
-  13:8   warning  'text-red-500' applies the same CSS properties as 'text-blue-500'  (cssConflict)
-
-Found 2 warnings in 1 file
-```
-
-**With --fix:**
-```
-src/components.html
-  ✔ Fixed 2 issues
+## Features
 
-✔ Fixed 2 issues
-```
+**Core (v3 & v4):**
+- CSS Conflicts - Detects when multiple classes apply the same CSS properties
+- Invalid @apply Usage - Validates if a class can be used with `@apply`
+- Invalid @screen References - Detects references to non-existent breakpoints
+- Invalid Config Paths - Validates references in `config()` and `theme()` functions
+- Invalid @tailwind Directives - Validates `@tailwind` layer values
+- Recommended Variant Order - Suggests preferred ordering of variants
+- Blocklisted Classes - Detects usage of blocklisted classes
+- Autofix - Automatically fix issues with `--fix` flag
 
-**With --verbose:**
-```
-→ Running in verbose mode
-  Working directory: /path/to/project
-  Config path: auto-discover
-  Fix mode: false
-  Patterns: src/**/*.tsx
-
-→ Initializing Tailwind CSS language service...
-  Tailwind version: 4.1.18
-  Config type: CSS (v4)
-  Config path: /path/to/project/app.css
-  ✓ Loaded v4 design system
-  ✓ State initialized successfully
-
-→ Discovered 15 files to lint
-  [1/15] Linting src/components/Button.tsx
-  [2/15] Linting src/components/Card.tsx
-  ...
-
-src/components/Button.tsx
-  10:8   warning  'p-4' applies the same CSS properties as 'px-8'  (cssConflict)
-
-Found 1 warning in 1 file
-```
+**v4-Specific:**
+- Canonical Class Suggestions - Suggests shorthand equivalents for arbitrary values (e.g., `top-[60px]` → `top-15`)
+- Invalid @source Directives - Validates `@source` directive paths
+- Full theme loading - Automatically loads Tailwind's default theme
 
 ## Development
 

src/adapters/v4-adapter.ts

@@ -38,6 +38,11 @@ export async function loadV4DesignSystem(
 				css: string,
 				options: {
 					base: string;
+					loadModule?: (
+						id: string,
+						base: string,
+						type: "config" | "plugin",
+					) => Promise<{ base: string; module: unknown }>;
 					loadStylesheet: (
 						id: string,
 						base: string,
@@ -51,6 +56,24 @@ export async function loadV4DesignSystem(
 
 			const designSystem = await loadDesignSystem(cssContent, {
 				base: basePath,
+				async loadModule(
+					id: string,
+					base: string,
+					_type: "config" | "plugin",
+				): Promise<{ base: string; module: unknown }> {
+					try {
+						const modulePath = require.resolve(id, { paths: [base, cwd] });
+						const module = require(modulePath);
+						return {
+							base: path.dirname(modulePath),
+							module,
+						};
+					} catch (error) {
+						throw new Error(
+							`Failed to load module "${id}": ${error instanceof Error ? error.message : String(error)}`,
+						);
+					}
+				},
 				async loadStylesheet(
 					_id: string,
 					base: string,

src/constants.ts

@@ -26,9 +26,26 @@ export const V4_CSS_NAMES = [
 	"index.css",
 	"tailwind.css",
 	"globals.css",
+	"global.css",
+	"styles.css",
+	"style.css",
+	"main.css",
 ];
 
-export const V4_CSS_FOLDERS = ["./", "./src/", "./app/", "./styles/"];
+export const V4_CSS_FOLDERS = [
+	"./",
+	"./src/",
+	"./src/css/",
+	"./src/style/",
+	"./src/styles/",
+	"./app/",
+	"./app/css/",
+	"./app/style/",
+	"./app/styles/",
+	"./css/",
+	"./style/",
+	"./styles/",
+];
 
 export const LANGUAGE_MAP: Record<string, string> = {
 	".astro": "astro",