chore: update ESLint configuration to use better-tailwindcss plugin (#13)

Author: jikkai

.husky/commit-msg

@@ -0,0 +1 @@
+npx --no -- commitlint --edit ${1}

.husky/pre-commit

@@ -0,0 +1 @@
+pnpm lint-staged

app/[lang]/[[...mdxPath]]/page.tsx

@@ -1,6 +1,5 @@
 import type { Metadata } from 'next'
 import { generateStaticParamsFor, importPage } from 'nextra/pages'
-import FeedbackMessage from '@/components/feedback-message'
 import { useMDXComponents } from '@/mdx-components'
 
 export const generateStaticParams = generateStaticParamsFor('mdxPath')
@@ -29,17 +28,6 @@ export default async function Page(props: PageProps) {
     <>
       <Wrapper toc={toc} metadata={metadata}>
         <MDXContent {...props} params={params} />
-
-        <footer className="pt-10">
-          <hr
-            className={`
-              border-gray-200
-              dark:border-gray-600
-            `}
-          />
-
-          <FeedbackMessage />
-        </footer>
       </Wrapper>
     </>
   )

commitlint.config.ts

@@ -0,0 +1,3 @@
+export default {
+  extends: ['@commitlint/config-conventional'],
+}

components/feedback-message.tsx

@@ -55,8 +55,8 @@ export function Preview(props: IPreviewProps) {
         </div>
       </header>
 
-      <div ref={containerRef} className="univer-flex-1 univer-overflow-hidden">
-        <div ref={ref} className="rounded-b-2xl-lg h-[480px] overflow-hidden" />
+      <div ref={containerRef} className="flex-1 overflow-hidden">
+        <div ref={ref} className="h-[480px] overflow-hidden rounded-b-2xl" />
       </div>
 
       <div

components/preview.tsx

@@ -102,10 +102,10 @@ export default function ProductSelector() {
       <a
         ref={btnRef}
         className={`
-          dark:hover:bg-primary-100/5
           flex w-full cursor-pointer items-center justify-between gap-2 rounded-md p-2 transition-all duration-200
           ease-in-out
           hover:bg-gray-200
+          dark:hover:bg-primary-100/5
         `}
         onClick={handleToggleVisible}
       >

components/product-selector.tsx

@@ -1,15 +1,14 @@
+import os from 'node:os'
 import antfu from '@antfu/eslint-config'
-import eslintPluginReadableTailwind from 'eslint-plugin-readable-tailwind'
+import eslintPluginBetterTailwindcss from 'eslint-plugin-better-tailwindcss'
+
+const isWindows = os.platform() === 'win32'
+const lineBreakStyle = isWindows ? 'windows' : 'unix'
 
 export default antfu({
   ignores: [
     '**/*.js',
     '**/.next/**/*',
-    'packages/api/pages/**/*',
-    'packages/api/dts/**/*.js',
-    'packages/api/content/**/*',
-    'packages/api/public/**/*',
-    'packages/showcase/src/*/demo/data.ts',
   ],
   formatters: true,
   markdown: true,
@@ -41,13 +40,14 @@ export default antfu({
         ],
       },
     ],
+    'react-hooks/rules-of-hooks': 'off',
     'padding-line-between-statements': [
       'error',
       { blankLine: 'always', prev: 'directive', next: '*' },
     ],
   },
 }, {
-  files: ['**/*.{jsx,tsx}'],
+  files: ['**/*.tsx'],
   languageOptions: {
     parserOptions: {
       ecmaFeatures: {
@@ -56,18 +56,25 @@ export default antfu({
     },
   },
   plugins: {
-    'readable-tailwind': eslintPluginReadableTailwind,
+    'better-tailwindcss': eslintPluginBetterTailwindcss,
+  },
+  settings: {
+    'better-tailwindcss': {
+      entryPoint: 'styles/globals.css',
+    },
   },
   rules: {
     // enable all recommended rules to warn
-    ...eslintPluginReadableTailwind.configs.warning.rules,
+    ...eslintPluginBetterTailwindcss.configs['recommended-warn'].rules,
     // enable all recommended rules to error
-    ...eslintPluginReadableTailwind.configs.error.rules,
-    'jsonc/sort-keys': ['warn'],
+    ...eslintPluginBetterTailwindcss.configs['recommended-error'].rules,
 
     // or configure rules individually
-    'readable-tailwind/multiline': ['warn', { printWidth: 120 }],
-
-    'react-hooks/rules-of-hooks': 'off',
+    'better-tailwindcss/multiline': ['warn', {
+      printWidth: 120,
+      group: 'newLine',
+      lineBreakStyle,
+    }],
+    'better-tailwindcss/no-conflicting-classes': 'off',
   },
 })

eslint.config.ts

@@ -1,59 +1,59 @@
 {
   "name": "@univerjs-site/docs",
   "type": "module",
-  "version": "0.8.0",
+  "version": "0.8.1",
   "private": true,
-  "packageManager": "pnpm@10.11.0",
+  "packageManager": "pnpm@10.12.1",
   "scripts": {
-    "prepare": "simple-git-hooks",
+    "prepare": "husky",
+    "pre-commit": "lint-staged",
     "dev": "next",
     "build": "NODE_OPTIONS=\"--max-old-space-size=4096\" next build",
     "start": "next start",
     "lint": "eslint ."
   },
   "dependencies": {
+    "@commitlint/cli": "^19.8.1",
+    "@commitlint/config-conventional": "^19.8.1",
     "@docsearch/css": "^3.9.0",
     "@docsearch/react": "^3.9.0",
     "@feelback/react": "^0.3.4",
     "@univerjs/icons": "^0.4.4",
-    "@univerjs/presets": "0.8.0",
-    "@univerjs/sheets-crosshair-highlight": "0.8.0",
-    "@univerjs/sheets-formula-ui": "0.8.0",
-    "@univerjs/themes": "0.8.0",
-    "@univerjs/uniscript": "0.8.0",
-    "@univerjs/watermark": "0.8.0",
+    "@univerjs/presets": "0.8.1",
+    "@univerjs/sheets-crosshair-highlight": "0.8.1",
+    "@univerjs/sheets-formula-ui": "0.8.1",
+    "@univerjs/themes": "0.8.1",
+    "@univerjs/uniscript": "0.8.1",
+    "@univerjs/watermark": "0.8.1",
     "clsx": "^2.1.1",
     "next": "15.3.3",
     "nextra": "^4.2.17",
     "nextra-theme-docs": "^4.2.17",
     "react": "19.1.0",
     "react-dom": "19.1.0",
-    "tailwind-merge": "^3.3.0"
+    "tailwind-merge": "^3.3.1"
   },
   "devDependencies": {
-    "@antfu/eslint-config": "^4.13.2",
-    "@eslint-react/eslint-plugin": "^1.50.0",
-    "@tailwindcss/postcss": "^4.1.8",
-    "@types/react": "^19.1.6",
-    "@types/react-dom": "^19.1.5",
+    "@antfu/eslint-config": "^4.14.1",
+    "@eslint-react/eslint-plugin": "^1.52.1",
+    "@tailwindcss/postcss": "^4.1.10",
+    "@types/react": "^19.1.8",
+    "@types/react-dom": "^19.1.6",
     "eslint": "^9.28.0",
+    "eslint-plugin-better-tailwindcss": "^3.1.0",
     "eslint-plugin-format": "^1.0.1",
     "eslint-plugin-react-hooks": "^5.2.0",
     "eslint-plugin-react-refresh": "^0.4.20",
-    "eslint-plugin-readable-tailwind": "^2.1.2",
     "file-loader": "^6.2.0",
+    "husky": "^9.1.7",
     "lint-staged": "^16.1.0",
-    "postcss": "^8.5.4",
-    "shiki": "^3.4.2",
-    "simple-git-hooks": "^2.13.0",
-    "tailwindcss": "^4.1.8",
+    "postcss": "^8.5.5",
+    "shiki": "^3.6.0",
+    "tailwindcss": "^4.1.10",
     "tailwindcss-animate": "^1.0.7",
     "typescript": "^5.8.3"
   },
-  "simple-git-hooks": {
-    "pre-commit": "pnpm lint-staged"
-  },
   "lint-staged": {
-    "!submodules/*": "eslint"
+    "*": "eslint --fix"
   }
 }