chore: update format and lint config

Author: hyoban

.github/workflows/release.yml

@@ -6,7 +6,7 @@ permissions:
 on:
   push:
     tags:
-      - 'v*'
+      - "v*"
 
 jobs:
   release:

.vscode/settings.json

@@ -1,41 +1,6 @@
 {
-  // Enable the ESlint flat config support
-  "eslint.experimental.useFlatConfig": true,
+  "editor.defaultFormatter": "esbenp.prettier-vscode",
+  "editor.formatOnSave": true,
 
-  // Disable the default formatter, use eslint instead
-  "prettier.enable": false,
-  "editor.formatOnSave": false,
-
-  // Auto fix
-  "editor.codeActionsOnSave": {
-    "source.fixAll": "explicit",
-    "source.organizeImports": "never"
-  },
-
-  // Silent the stylistic rules in you IDE, but still auto fix them
-  "eslint.rules.customizations": [
-    { "rule": "style/*", "severity": "off" },
-    { "rule": "*-indent", "severity": "off" },
-    { "rule": "*-spacing", "severity": "off" },
-    { "rule": "*-spaces", "severity": "off" },
-    { "rule": "*-order", "severity": "off" },
-    { "rule": "*-dangle", "severity": "off" },
-    { "rule": "*-newline", "severity": "off" },
-    { "rule": "*quotes", "severity": "off" },
-    { "rule": "*semi", "severity": "off" }
-  ],
-
-  // Enable eslint for all supported languages
-  "eslint.validate": [
-    "javascript",
-    "javascriptreact",
-    "typescript",
-    "typescriptreact",
-    "vue",
-    "html",
-    "markdown",
-    "json",
-    "jsonc",
-    "yaml"
-  ]
+  "eslint.experimental.useFlatConfig": true
 }

README.md

@@ -19,14 +19,14 @@ ni -D unocss-preset-shadcn
 
 ```ts
 // unocss.config.ts
-import { defineConfig, presetUno } from 'unocss'
-import { presetShadcn } from 'unocss-preset-shadcn'
+import { defineConfig, presetUno } from "unocss"
+import { presetShadcn } from "unocss-preset-shadcn"
 
 export default defineConfig({
   presets: [
     presetUno(),
     presetShadcn({
-      color: 'red',
+      color: "red",
     }),
   ],
 })

build.config.ts

@@ -1,9 +1,7 @@
-import { defineBuildConfig } from 'unbuild'
+import { defineBuildConfig } from "unbuild"
 
 export default defineBuildConfig({
-  entries: [
-    'src/index',
-  ],
+  entries: ["src/index"],
   declaration: true,
   clean: true,
   rollup: {

eslint.config.js

@@ -1,16 +1,53 @@
-// @ts-check
-import antfu from '@antfu/eslint-config'
+import process from "node:process"
+import ts from "@typescript-eslint/eslint-plugin"
+import tsParser from "@typescript-eslint/parser"
+import prettier from "eslint-config-prettier"
+import unicorn from "eslint-plugin-unicorn"
 
-export default antfu(
+const files = ["src/**/*.{ts,tsx}"]
+const languageOptions = {
+  parser: tsParser,
+  parserOptions: {
+    project: true,
+    tsconfigRootDir: process.cwd(),
+  },
+}
+const linterOptions = {
+  reportUnusedDisableDirectives: true,
+}
+const plugins = {
+  "@typescript-eslint": ts,
+  prettier,
+  unicorn,
+}
+
+export default [
   {
-    ignores: [
-      // eslint ignore globs here
-      'playground/package.json',
-    ],
+    files,
+    languageOptions,
+    linterOptions,
+    plugins,
+    rules: {
+      ...ts.configs["strict-type-checked"]?.rules,
+      "@typescript-eslint/no-non-null-assertion": "off",
+      "@typescript-eslint/no-unused-vars": "off",
+      "@typescript-eslint/no-import-type-side-effects": "error",
+
+      ...unicorn.configs.recommended.rules,
+      "unicorn/prevent-abbreviations": "off",
+      "unicorn/catch-error-name": "off",
+      "unicorn/prefer-top-level-await": "off",
+      "unicorn/no-null": "off",
+    },
   },
+  // disable formatting rules, make sure to put this last
   {
+    files,
+    languageOptions,
+    linterOptions,
+    plugins,
     rules: {
-      // overrides
+      ...prettier.rules,
     },
   },
-)
+]

package.json

@@ -38,12 +38,14 @@
   "scripts": {
     "build": "unbuild",
     "dev": "unbuild --stub",
-    "lint": "eslint .",
+    "lint": "eslint --max-warnings 0 .",
     "prepublishOnly": "nr build",
     "release": "bumpp && npm publish",
     "start": "esno src/index.ts",
     "test": "vitest",
     "typecheck": "tsc --noEmit",
+    "format": "prettier --write .",
+    "format:check": "prettier --check .",
     "prepare": "simple-git-hooks"
   },
   "peerDependencies": {
@@ -56,12 +58,18 @@
     "@antfu/eslint-config": "^2.1.2",
     "@antfu/ni": "^0.21.12",
     "@antfu/utils": "^0.7.6",
+    "@ianvs/prettier-plugin-sort-imports": "^4.1.1",
     "@types/node": "^20.10.1",
+    "@typescript-eslint/eslint-plugin": "^6.13.1",
+    "@typescript-eslint/parser": "^6.13.1",
     "bumpp": "^9.2.0",
     "eslint": "^8.54.0",
+    "eslint-config-prettier": "^9.0.0",
+    "eslint-plugin-unicorn": "^49.0.0",
     "esno": "^4.0.0",
     "lint-staged": "^15.1.0",
     "pnpm": "^8.11.0",
+    "prettier": "^3.1.0",
     "rimraf": "^5.0.5",
     "simple-git-hooks": "^2.9.0",
     "typescript": "^5.3.2",
@@ -70,9 +78,6 @@
     "vitest": "^1.0.0-beta.6"
   },
   "simple-git-hooks": {
-    "pre-commit": "pnpm lint-staged"
-  },
-  "lint-staged": {
-    "*": "eslint --fix"
+    "pre-commit": "pnpm run format:check && pnpm run lint && pnpm run typecheck"
   }
 }

playground/package.json

@@ -26,4 +26,4 @@
     "preview": "vite preview"
   },
   "type": "module"
-}
+}

playground/src/App.tsx

@@ -1,4 +1,4 @@
-import { Button } from '@/components/ui/button'
+import { Button } from "@/components/ui/button"
 
 export default function ButtonDemo() {
   return <Button>Button</Button>

playground/src/components/ui/button.tsx

@@ -1,47 +1,48 @@
-import * as React from 'react'
-import { Slot } from '@radix-ui/react-slot'
-import { type VariantProps, cva } from 'class-variance-authority'
+import { cn } from "@/lib/utils"
+import { Slot } from "@radix-ui/react-slot"
+import { cva } from "class-variance-authority"
+import * as React from "react"
 
-import { cn } from '@/lib/utils'
+import type { VariantProps } from "class-variance-authority"
 
 const buttonVariants = cva(
-  'inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50',
+  "inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50",
   {
     variants: {
       variant: {
-        default: 'bg-primary text-primary-foreground hover:bg-primary/90',
+        default: "bg-primary text-primary-foreground hover:bg-primary/90",
         destructive:
-          'bg-destructive text-destructive-foreground hover:bg-destructive/90',
+          "bg-destructive text-destructive-foreground hover:bg-destructive/90",
         outline:
-          'border border-input bg-background hover:bg-accent hover:text-accent-foreground',
+          "border border-input bg-background hover:bg-accent hover:text-accent-foreground",
         secondary:
-          'bg-secondary text-secondary-foreground hover:bg-secondary/80',
-        ghost: 'hover:bg-accent hover:text-accent-foreground',
-        link: 'text-primary underline-offset-4 hover:underline',
+          "bg-secondary text-secondary-foreground hover:bg-secondary/80",
+        ghost: "hover:bg-accent hover:text-accent-foreground",
+        link: "text-primary underline-offset-4 hover:underline",
       },
       size: {
-        default: 'h-10 px-4 py-2',
-        sm: 'h-9 rounded-md px-3',
-        lg: 'h-11 rounded-md px-8',
-        icon: 'h-10 w-10',
+        default: "h-10 px-4 py-2",
+        sm: "h-9 rounded-md px-3",
+        lg: "h-11 rounded-md px-8",
+        icon: "h-10 w-10",
       },
     },
     defaultVariants: {
-      variant: 'default',
-      size: 'default',
+      variant: "default",
+      size: "default",
     },
   },
 )
 
 export interface ButtonProps
   extends React.ButtonHTMLAttributes<HTMLButtonElement>,
-  VariantProps<typeof buttonVariants> {
+    VariantProps<typeof buttonVariants> {
   asChild?: boolean
 }
 
 const Button = React.forwardRef<HTMLButtonElement, ButtonProps>(
   ({ className, variant, size, asChild = false, ...props }, ref) => {
-    const Comp = asChild ? Slot : 'button'
+    const Comp = asChild ? Slot : "button"
     return (
       <Comp
         className={cn(buttonVariants({ variant, size, className }))}
@@ -51,6 +52,6 @@ const Button = React.forwardRef<HTMLButtonElement, ButtonProps>(
     )
   },
 )
-Button.displayName = 'Button'
+Button.displayName = "Button"
 
 export { Button, buttonVariants }

playground/src/lib/utils.ts

@@ -1,6 +1,7 @@
-import type { ClassValue } from 'clsx'
-import { clsx } from 'clsx'
-import { twMerge } from 'tailwind-merge'
+import { clsx } from "clsx"
+import { twMerge } from "tailwind-merge"
+
+import type { ClassValue } from "clsx"
 
 export function cn(...inputs: ClassValue[]) {
   return twMerge(clsx(inputs))

playground/src/main.tsx

@@ -1,10 +1,12 @@
-import React from 'react'
-import ReactDOM from 'react-dom/client'
-import App from './App.tsx'
-import '@unocss/reset/tailwind.css'
-import 'virtual:uno.css'
+import React from "react"
+import ReactDOM from "react-dom/client"
 
-ReactDOM.createRoot(document.getElementById('root')!).render(
+import App from "./App.tsx"
+
+import "@unocss/reset/tailwind.css"
+import "virtual:uno.css"
+
+ReactDOM.createRoot(document.getElementById("root")!).render(
   <React.StrictMode>
     <App />
   </React.StrictMode>,

playground/tsconfig.json

@@ -8,9 +8,7 @@
     "module": "ESNext",
     "moduleResolution": "bundler",
     "paths": {
-      "@/*": [
-        "./src/*"
-      ]
+      "@/*": ["./src/*"]
     },
     "resolveJsonModule": true,
     "allowImportingTsExtensions": true,

playground/uno.config.ts

@@ -1,11 +1,11 @@
-import { defineConfig, presetUno } from 'unocss'
-import { presetShadcn } from 'unocss-preset-shadcn'
+import { defineConfig, presetUno } from "unocss"
+import { presetShadcn } from "unocss-preset-shadcn"
 
 export default defineConfig({
   presets: [
     presetUno(),
     presetShadcn({
-      color: 'red',
+      color: "red",
     }),
   ],
 })

playground/vite.config.ts

@@ -1,13 +1,13 @@
-import path from 'node:path'
-import { defineConfig } from 'vite'
-import react from '@vitejs/plugin-react'
-import UnoCSS from 'unocss/vite'
+import path from "node:path"
+import react from "@vitejs/plugin-react"
+import UnoCSS from "unocss/vite"
+import { defineConfig } from "vite"
 
 export default defineConfig({
   plugins: [react(), UnoCSS()],
   resolve: {
     alias: {
-      '@': path.resolve(__dirname, './src'),
+      "@": path.resolve(__dirname, "./src"),
     },
   },
 })