Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/xats-lab/eslint-config
🧃 Xat's ESLint config preset
https://github.com/xats-lab/eslint-config
eslint eslint-config
Last synced: 3 months ago
JSON representation
🧃 Xat's ESLint config preset
- Host: GitHub
- URL: https://github.com/xats-lab/eslint-config
- Owner: Xats-Lab
- License: mit
- Created: 2024-09-05T05:06:31.000Z (5 months ago)
- Default Branch: main
- Last Pushed: 2024-10-21T05:13:10.000Z (3 months ago)
- Last Synced: 2024-10-29T01:23:42.235Z (3 months ago)
- Topics: eslint, eslint-config
- Language: TypeScript
- Homepage: https://eslint.xatloon.com
- Size: 827 KB
- Stars: 0
- Watchers: 1
- Forks: 1
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# @xats/eslint-config
[](https://npmjs.com/package/@xats/eslint-config)
> Base on [Antfu's ESLint config preset](https://github.com/antfu/eslint-config)
>
> Inspired by [Hyoban's ESLint config preset](https://github.com/hyoban/eslint-config-hyoban)
All in One ESLint config.
## Features
- Auto fix for formatting (**without** Prettier)
- [Auto detect](#auto-detect) your codebase and enable needed rules
- Out of box level's support `toml`, `yaml`, `json`, `html`
- Work with **React, Astro**
- [ESLint Flat config](https://eslint.org/docs/latest/use/configure/configuration-files-new), compose easily!
- Using [ESLint Stylistic](https://github.com/eslint-stylistic/eslint-stylistic)
- Respects `.gitignore` by default
- Requires ESLint v9.5.0+
## Usage
1. Install by your package manager
```shell
npm install -D eslint @xats/eslint-config
```
```shell
pnpm add -D eslint @xats/eslint-config
```
```shell
yarn add -D eslint @xats/eslint-config
```
```shell
bun add -D eslint @xats/eslint-config
```
2. Create a `eslint.config.js` if your package.json set `"type": "module"`, otherwise create a `eslint.config.mjs`
```js
// eslint.config.js
// or eslint.config.mjs
import { xat } from '@xats/eslint-config'
export default xat()
```
3. Add scripts for `package.json`
For example:
```json
{
"scripts": {
"lint": "eslint .",
"lint:fix": "eslint . --fix"
}
}
```
4. VS Code - Auto fix on save (Optional)
Copied from antfu
```json
{
// Disable the default formatter, use eslint instead
"prettier.enable": false,
"editor.formatOnSave": false,
// Auto fix
"editor.codeActionsOnSave": {
"source.fixAll.eslint": "explicit",
"source.organizeImports": "never"
},
// Silent the stylistic rules in you IDE, but still auto fix them
"eslint.rules.customizations": [
{ "rule": "@stylistic/*", "severity": "off", "fixable": true },
{ "rule": "format/*", "severity": "off", "fixable": true },
{ "rule": "*-indent", "severity": "off", "fixable": true },
{ "rule": "*-spacing", "severity": "off", "fixable": true },
{ "rule": "*-spaces", "severity": "off", "fixable": true },
{ "rule": "*-order", "severity": "off", "fixable": true },
{ "rule": "*-dangle", "severity": "off", "fixable": true },
{ "rule": "*-newline", "severity": "off", "fixable": true },
{ "rule": "*quotes", "severity": "off", "fixable": true },
{ "rule": "*semi", "severity": "off", "fixable": true }
],
// Enable eslint for all supported languages
"eslint.validate": [
"javascript",
"javascriptreact",
"typescript",
"typescriptreact",
"json",
"jsonc",
"yaml",
"toml",
"html",
"astro",
]
}
```
## All Plugins
See `package.json`'s [dependencies list](https://github.com/Xats-Lab/eslint-config/blob/main/package.json)
## Auto-detect
This config will look up your `package.json`, and auto enable related config rules
### UI
- Astro: `astro`
- React: `react`
### Style
- UnoCSS: `unocss`
- TailwindCSS: `tailwindcss`
### Devtool
- TypeScript: `typescript`
## All Plugins
⚡️: Auto detect
👍🏻: Enabled default
🔧: Default disabled, need turn on manually.
That's all plugins and its status
### Base - you can **not** disable this configs, but you can still disable individual rule
- [eslint-plugin-n](https://www.npmjs.com/package/eslint-plugin-n)
- [eslint-plugin-jsdoc](https://www.npmjs.com/package/eslint-plugin-jsdoc)
- [eslint-plugin-import-x]( https://www.npmjs.com/package/eslint-plugin-import-x)
- [eslint-plugin-unused-imports](https://www.npmjs.com/package/eslint-plugin-unused-imports)
- [eslint-plugin-perfectionist](https://www.npmjs.com/package/eslint-plugin-perfectionist)
- [eslint-config-flat-gitignore](https://www.npmjs.com/package/eslint-config-flat-gitignore)
### Astro
- [eslint-plugin-astro](https://www.npmjs.com/package/eslint-plugin-astro) - ⚡️
### React
- [@eslint-react/eslint-plugin](https://npmjs.com/package/@eslint-react/eslint-plugin) - ⚡️
- [eslint-plugin-react-hooks](https://www.npmjs.com/package/eslint-plugin-react-hooks) - ⚡️
- [eslint-plugin-react-refresh](https://www.npmjs.com/package/eslint-plugin-react-refresh) - ⚡️
### Style
- [eslint-plugin-tailwindcss](https://www.npmjs.com/package/eslint-plugin-tailwindcss) - ⚡️
- [@unocss/eslint-plugin](https://www.npmjs.com/package/@unocss/eslint-plugin) - ⚡️
### Devtools
- [@typescript-eslint/eslint-plugin](https://www.npmjs.com/package/@typescript-eslint/eslint-plugin) - ⚡️
### Document
- [eslint-plugin-jsonc](https://www.npmjs.com/package/eslint-plugin-jsonc) - 👍🏻 `jsonc`
- [eslint-plugin-toml](https://www.npmjs.com/package/eslint-plugin-toml) - 👍🏻 `toml`
- [eslint-plugin-yml](https://www.npmjs.com/package/eslint-plugin-yml) - 👍🏻 `yaml`
### Miscs
- [@stylistic/eslint-plugin](https://www.npmjs.com/package/@stylistic/eslint-plugin) - 👍🏻 `stylistic`
- [eslint-plugin-regexp](https://www.npmjs.com/package/eslint-plugin-regexp) - 👍🏻 `regexp`
- [eslint-plugin-unicorn](https://www.npmjs.com/package/eslint-plugin-unicorn) - 👍🏻 `unicorn`
## Customization
[ESLint Flat config](https://eslint.org/docs/latest/use/configure/configuration-files-new) give us power to customize config.
Normally you only need to import the `xat` preset:
```js
// eslint.config.js
import { xat } from '@xats/eslint-config'
export default xat()
```
And that's it! Or you can configure each integration individually, this is an all options example:
```js
// eslint.config.js
import { xat } from '@xats/eslint-config'
export default xat({
// Type of the project.
// set to 'lib' will enable stricter rules
// @default: 'app'
type: 'lib', // 'app' | 'lib'
// Enable stylistic formatting rules
// Or customize the stylistic rules by give an object
// @default: 'true'
stylistic: {
indent: 2, // 4, or 'tab'
quotes: 'single', // or 'double'
},
// Disable some items
jsonc: false,
yaml: false,
toml: false,
unicorn: false,
// You can also disable some autodetected configs
react: false,
astro: false,
typescript: false,
tailwind: false,
unocss: false,
// `.eslintignore` is no longer supported in Flat config, use `ignores` instead
ignores: [
'**/fixtures',
// ...globs
]
})
```
The `antfu`... sorry, I mean `xat` factory function also accepts any number of arbitrary custom config overrides:
```js
// eslint.config.js
import { xat } from '@antfu/eslint-config'
export default xat(
{
// Configures for xat's config
},
// From the second arguments they are ESLint Flat Configs
// you can have multiple configs
{
files: ['**/*.ts'],
rules: {},
},
{
rules: {},
},
)
```
Check out the [configs](https://github.com/Xats-Lab/eslint-config/blob/main/src/configs) and [factory](https://github.com/Xats-Lab/eslint-config/blob/main/src/factory.ts) for more details.
By the way, this config is based on `@antfu/[email protected]`, So you can reference it's [Customization section](https://github.com/antfu/eslint-config/tree/v3.5.0#Customization).
## License
[MIT](./LICENSE) License © 2024-PRESENT [Xat](https://github.com/Xatloon)