@kazupon/eslint-config NPM

@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
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)

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:

Configuration	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`	yes
`css`	`@eslint/css`	yes
`html`	`@html-eslint/eslint-plugin`	yes

You can use import syntax:

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

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