docs: add oxlint documentation

README.md

@@ -180,16 +180,33 @@ See the [Advanced configuration guide](./docs/configuration/advanced.md) to lear
 
 ##### Auto-fix on save
 
-Most rules are intended to automatically fix the tailwind classes. If you have installed the [VSCode ESLint plugin](https://marketplace.visualstudio.com/items?itemName=dbaeumer.vscode-eslint), you can configure it to automatically fix the classes on save by adding the following options to your `.vscode/settings.json`:
+Most rules are intended to automatically fix the tailwind classes using VSCode extensions.
+
+###### ESLint
+
+For ESLint, you can install the [VSCode ESLint plugin](https://marketplace.visualstudio.com/items?itemName=dbaeumer.vscode-eslint) and configure it to automatically fix the classes on save by adding the following options to your `.vscode/settings.json`:
 
 ```jsonc
 {
-  // enable ESLint to fix tailwind classes on save
+  // enable VSCode to fix tailwind classes on save
   "editor.codeActionsOnSave": {
     "source.fixAll.eslint": "explicit"
   }
 }
 ```
 
+###### Oxlint
+
+For Oxlint, you can install the [VSCode Oxc plugin](https://marketplace.visualstudio.com/items?itemName=oxc.oxc-vscode) and configure it to automatically fix the classes on save by adding the following options to your `.vscode/settings.json`:
+
+```jsonc
+{
+  // enable VSCode to fix tailwind classes on save
+  "editor.codeActionsOnSave": {
+    "source.fixAll.oxc": "explicit"
+  }
+}
+```
+
 <br/>
 <br/>

docs/parsers/angular.md

@@ -1,6 +1,11 @@
 # Angular
 
-## Flat config
+- [ESLint](#eslint)
+- [Oxlint](#oxlint)
+
+<br/>
+
+## ESLint
 
 To use ESLint with Angular, install [Angular ESLint](https://github.com/angular-eslint/angular-eslint?tab=readme-ov-file#quick-start) and [TypeScript ESLint](https://typescript-eslint.io/getting-started). You can follow the [flat config](https://github.com/angular-eslint/angular-eslint/blob/main/docs/CONFIGURING_FLAT_CONFIG.md) setup, which includes rules from the Angular ESLint package or you can add the parser directly by following the steps below.
 
@@ -17,8 +22,12 @@ To lint Tailwind CSS classes in Angular files, ensure that:
 
 <br/>
 
+### Flat config
+
 Read more about the [ESLint flat config format](https://eslint.org/docs/latest/use/configure/configuration-files-new)
 
+<br/>
+
 ```js
 // eslint.config.js
 
@@ -73,7 +82,7 @@ export default defineConfig([
 <br/>
 
 <details>
-  <summary>Legacy config</summary>
+  <summary><h3>Legacy config</h3></summary>
 
   <br/>
 
@@ -132,3 +141,12 @@ export default defineConfig([
   ```
 
 </details>
+
+<br/>
+
+## Oxlint
+
+Oxlint currently does **not** support Angular templates and inline template processing.
+Framework-specific parsers/processors like Angular are not supported in Oxlint yet, so `eslint-plugin-better-tailwindcss` cannot currently lint Angular templates through Oxlint.
+
+You can continue using ESLint for Angular files until Oxlint adds framework parser support.

docs/parsers/astro.md

@@ -1,6 +1,11 @@
 # Astro
 
-## Flat config
+- [ESLint](#eslint)
+- [Oxlint](#oxlint)
+
+<br/>
+
+## ESLint
 
 To use ESLint with Astro files, first install the [astro-eslint-parser](https://github.com/ota-meshi/astro-eslint-parser) and optionally [TypeScript ESLint](https://typescript-eslint.io/getting-started). Then, configure ESLint to use this parser for Astro files.
 
@@ -17,8 +22,12 @@ To lint Tailwind CSS classes in Astro files, ensure that:
 
 <br/>
 
+### Flat config
+
 Read more about the [ESLint flat config format](https://eslint.org/docs/latest/use/configure/configuration-files-new)
 
+<br/>
+
 ```js
 // eslint.config.js
 
@@ -62,7 +71,7 @@ export default defineConfig({
 <br/>
 
 <details>
-  <summary>Legacy config</summary>
+  <summary><h3>Legacy config</h3></summary>
 
   <br/>
 
@@ -115,3 +124,12 @@ export default defineConfig({
   ```
 
 </details>
+
+<br/>
+
+## Oxlint
+
+Oxlint currently does **not** support Astro files (`.astro`).
+Framework-specific parsers like Astro are not supported in Oxlint yet, so `eslint-plugin-better-tailwindcss` cannot currently lint Astro templates through Oxlint.
+
+You can continue using ESLint for Astro files until Oxlint adds framework parser support.

docs/parsers/css.md

@@ -1,5 +1,12 @@
 # CSS
 
+- [ESLint](#eslint)
+- [Oxlint](#oxlint)
+
+<br/>
+
+## ESLint
+
 To use ESLint with CSS files containing Tailwind CSS `@apply` directives, first install the [@eslint/css](https://github.com/eslint/css) plugin and the [tailwind-csstree](https://www.npmjs.com/package/tailwind-csstree) custom syntax.
 
 ```sh
@@ -15,10 +22,12 @@ To lint Tailwind CSS classes in CSS files, ensure that:
 
 <br/>
 
-## Flat config
+### Flat config
 
 Read more about the [ESLint flat config format](https://eslint.org/docs/latest/use/configure/configuration-files-new)
 
+<br/>
+
 ```js
 // eslint.config.js
 
@@ -65,3 +74,12 @@ export default defineConfig({
 <br/>
 
 > **Note:** Legacy config is not supported for CSS files as the `@eslint/css` plugin requires the ESLint flat config format.
+
+<br/>
+
+## Oxlint
+
+Oxlint currently does **not** support CSS parser integration for this use case.
+Because Oxlint currently only supports JavaScript-like files, `eslint-plugin-better-tailwindcss` cannot currently lint CSS `@apply` directives through Oxlint.
+
+You can continue using ESLint for CSS files until broader parser support is available in Oxlint.

docs/parsers/html.md

@@ -1,5 +1,12 @@
 # HTML
 
+- [ESLint](#eslint)
+- [Oxlint](#oxlint)
+
+<br/>
+
+## ESLint
+
 To use ESLint with HTML files, first install the [@html-eslint/parser](https://github.com/yeonjuan/html-eslint/tree/main/packages/parser).
 
 ```sh
@@ -14,10 +21,12 @@ To lint Tailwind CSS classes in HTML files, ensure that:
 
 <br/>
 
-## Flat config
+### Flat config
 
 Read more about the [ESLint flat config format](https://eslint.org/docs/latest/use/configure/configuration-files-new)
 
+<br/>
+
 ```js
 // eslint.config.js
 
@@ -56,7 +65,7 @@ export default defineConfig({
 <br/>
 
 <details>
-  <summary>Legacy config</summary>
+  <summary><h3>Legacy config</h3></summary>
 
   <br/>
 
@@ -89,3 +98,12 @@ export default defineConfig({
   ```
 
 </details>
+
+<br/>
+
+## Oxlint
+
+Oxlint currently does **not** support HTML parser integration for this use case.
+Because Oxlint currently only supports JavaScript-like files, `eslint-plugin-better-tailwindcss` cannot currently lint standalone HTML files through Oxlint.
+
+You can continue using ESLint for HTML files until broader parser support is available in Oxlint.

docs/parsers/javascript.md

@@ -1,18 +1,25 @@
 # JavaScript
 
+- [ESLint](#eslint)
+- [Oxlint](#oxlint)
+
+<br/>
+
+## ESLint
+
 To lint Tailwind CSS classes in JavaScript files, ensure that:
 
 - The plugin is added to your configuration.
 - The `settings` object contains the correct Tailwind CSS configuration paths.
 
 <br/>
 
-## Usage
-
 ### Flat config
 
 Read more about the [ESLint flat config format](https://eslint.org/docs/latest/use/configure/configuration-files-new)
 
+<br/>
+
 ```js
 // eslint.config.js
 
@@ -44,7 +51,7 @@ export default defineConfig({
 <br/>
 
 <details>
-  <summary>Legacy config</summary>
+  <summary><h3>Legacy config</h3></summary>
 
   <br/>
 
@@ -74,3 +81,45 @@ export default defineConfig({
   ```
 
 </details>
+
+<br/>
+
+## Oxlint
+
+More info about the Oxlint configuration format can be found in the [Oxlint documentation](https://oxc.rs/docs/guide/usage/linter/config.html).
+
+To lint Tailwind CSS classes in JavaScript files, ensure that:
+
+- The plugin is added to the `jsPlugins` array.
+- The `settings` object contains the correct Tailwind CSS configuration paths.
+- All relevant rules are added to the `rules` object.
+
+<br/>
+
+```js
+// oxlint.config.js
+
+import eslintPluginBetterTailwindcss from "eslint-plugin-better-tailwindcss";
+import { defineConfig } from "oxlint";
+
+export default defineConfig({
+  overrides: [{
+    files: ["**/*.{js,cjs,mjs}"],
+    jsPlugins: [
+      "eslint-plugin-better-tailwindcss"
+    ],
+    rules: {
+      // enable all recommended rules
+      ...eslintPluginBetterTailwindcss.configs.recommended.rules,
+
+      // if needed, override rules to configure them individually
+      "better-tailwindcss/enforce-consistent-line-wrapping": ["warn", { printWidth: 100 }]
+    }
+  }],
+  settings: {
+    "better-tailwindcss": {
+      entryPoint: "src/global.css"
+    }
+  }
+});
+```

docs/parsers/jsx.md

@@ -1,19 +1,26 @@
 # JSX
 
+- [ESLint](#eslint)
+- [Oxlint](#oxlint)
+
+<br/>
+
+## ESLint
+
 To lint Tailwind CSS classes in JSX files, ensure that:
 
-- `jsx` parsing is enabled.
+- `jsx` parsing is enabled in language options.
 - The plugin is added to your configuration.
 - The `settings` object contains the correct Tailwind CSS configuration paths.
 
 <br/>
 
-## Usage
-
 ### Flat config
 
 Read more about the [ESLint flat config format](https://eslint.org/docs/latest/use/configure/configuration-files-new)
 
+<br/>
+
 ```js
 // eslint.config.js
 
@@ -53,7 +60,7 @@ export default defineConfig({
 <br/>
 
 <details>
-  <summary>Legacy config</summary>
+  <summary><h3>Legacy config</h3></summary>
 
   <br/>
 
@@ -92,3 +99,45 @@ export default defineConfig({
   ```
 
 </details>
+
+<br/>
+
+## Oxlint
+
+More info about the Oxlint configuration format can be found in the [Oxlint documentation](https://oxc.rs/docs/guide/usage/linter/config.html).
+
+To lint Tailwind CSS classes in JSX files, ensure that:
+
+- The plugin is added to the `jsPlugins` array.
+- The `settings` object contains the correct Tailwind CSS configuration paths.
+- All relevant rules are added to the `rules` object.
+
+<br/>
+
+```js
+// oxlint.config.js
+
+import eslintPluginBetterTailwindcss from "eslint-plugin-better-tailwindcss";
+import { defineConfig } from "oxlint";
+
+export default defineConfig({
+  overrides: [{
+    files: ["**/*.{js,jsx,mjs,cjs}"],
+    jsPlugins: [
+      "eslint-plugin-better-tailwindcss"
+    ],
+    rules: {
+      // enable all recommended rules
+      ...eslintPluginBetterTailwindcss.configs.recommended.rules,
+
+      // if needed, override rules to configure them individually
+      "better-tailwindcss/enforce-consistent-line-wrapping": ["warn", { printWidth: 100 }]
+    }
+  }],
+  settings: {
+    "better-tailwindcss": {
+      entryPoint: "src/global.css"
+    }
+  }
+});
+```