@kazupon/eslint-config

ESLint config for @kazupon

🌟 Features

• Flat configuration via vite flavor defineConfig
• Support built-in preset configurations
  • javascript
  • stylistic
  • comments
  • typescript
  • imports
  • jsdoc
  • regexp
  • promise
  • unicorn
  • prettier
  • vue
  • react
  • svelte
  • vitest
  • jsonc
  • yml
  • toml
  • markdown
  • css
  • html
  • deps
• Support primitive eslint flat configuration
• Support overrides for built-in configurations
  • rules

💿 Installation

npm i -D @kazupon/eslint-config

🚀 Usage

Configurations

Add create eslint.config.mjs in your project root:

// eslint.config.mjs
import { defineConfig, javascript } from '@kazupon/eslint-config'

// You can put flat configurations (`Linter.Config | Linter.Config[]`)
export default defineConfig(
  // built-in configurations
  javascript({
    // override rules
    rules: {
      'no-console': 'error'
    }
  }),
  // You can put primitive flat configuration, and override it!
  {
    ignores: ['**/dist/**' /* something ignores ... */]
  }
)

[!IMPORTANT]
Support flat configuration only, not supported Legacy style (.eslintrc)undefined

Lint with npm scripts package.json

For example:

{
  "scripts": {
    "lint": "eslint .",
    "lint:fix": "eslint . --fix"
  }
}

Lint with VS Code settings.json

You can lint and auto fix.

Install VS Code ESLint extension.

Add the following settings to your .vscode/settings.json:

{
  // Auto fix
  "editor.codeActionsOnSave": {
    "source.fixAll.eslint": "explicit"
  },
  // Enable eslint for supported languages
  "eslint.validate": [
    "javascript",
    "javascriptreact",
    "typescript",
    "typescriptreact",
    "vue",
    "svelte",
    "json",
    "jsonc",
    "json5",
    "markdown",
    "html",
    "yaml",
    "toml",
    "css",
    "html"
  ]
}

🔨Built-in preset configurations

The following built-in preset configurations are supported:

Preset	Powered by eslint plugin or package	Need to install eslint plugin or package?
javascript	@eslint/js	no (built-in)
stylistic	@stylistic/eslint-plugin	no (built-in)
comments	@eslint-community/eslint-plugin-eslint-comments, @kazupon/eslint-plugin(comment config)	no (built-in)
typescript	typescript-eslint	yes
imports	eslint-plugin-import, eslint-plugin-unused-imports, eslint-plugin-module-interop	yes
jsdoc	eslint-plugin-jsdoc	yes
regexp	eslint-plugin-regexp	yes
promise	eslint-plugin-promise	yes
unicorn	eslint-plugin-unicorn	yes
prettier	eslint-config-prettier	yes
vue	eslint-plugin-vue, eslint-plugin-vue-composable, eslint-plugin-vue-scoped-css, eslint-plugin-vuejs-accessibility, @intlify/eslint-plugin-vue-i18n	yes
react	eslint-plugin-react, eslint-plugin-react-hooks, eslint-plugin-react-refresh	yes
svelte	eslint-plugin-svelte	yes
vitest	@vitest/eslint-plugin	yes
jsonc	eslint-plugin-jsonc	yes
yml	eslint-plugin-yml	yes
toml	eslint-plugin-toml	yes
markdown	@eslint/markdown, eslint-plugin-markdown-preferences	yes
css	@eslint/css	yes
html	@html-eslint/eslint-plugin	yes
deps	eslint-plugin-barrel-files	yes

You can use import syntax:

import { defineConfig, javascript, typescript } from '@kazupon/eslint-config'

export default defineConfig(
  javascript(/* ... */),
  typescript(/* ... */)
  // ...
)

⚖️ Comparing to @antfu/eslint-config and others

• Respect the recommended config by the eslint plugin in built-in configurations
• Customization is overriding it only

💖 Credit

This eslint config is inspired by:

• @antfu/eslint-config, created by Anthony Fu
• @sxzz/eslint-config, created by Kevin Deng 三咲智子
• Vite, created by Evan You and Vite community

Thank you! ❤️

©️ License

MIT