[!IMPORTANT] This repository was originally forked from @antfu/eslint-config, but may not be kept up to date with the latest changes and will eventually evolve into my own version. Some rules were modified to fit my own preferences.
- Double quotes, with semi
- Brace style:
1tbs
- Curly:
all
- HTML self closing:
<div></div>
<img />
<MyComponent />
- React support becomes built-in and auto-detected
To set up your project, or migrate from the legacy config to the new flat config
npx @bernankez/eslint-config@latest
pnpm install -D eslint @bernankez/eslint-config
#for better output
pnpm install -D eslint-formatter-mo
// eslint.config.mjs
import bernankez from "@bernankez/eslint-config";
export default bernankez();
Combined with legacy config:
// eslint.config.js
const bernankez = require("@bernankez/eslint-config").default;
const { FlatCompat } = require("@eslint/eslintrc");
const compat = new FlatCompat();
module.exports = bernankez(
{
ignores: [],
},
// Legacy config
...compat.config({
extends: [
"eslint:recommended",
// Other extends...
],
})
// Other flat configs...
);
Note that
.eslintignore
no longer works in Flat config, see customization for more details.
For example:
{
"scripts": {
"lint": "eslint . -f mo",
"lint:fix": "eslint . -f mo --fix"
}
}
Install VS Code ESLint extension
Add the following settings to your .vscode/settings.json
:
{
// Enable the ESlint flat config support
// (remove this if your ESLint extension above v3.0.5)
"eslint.experimental.useFlatConfig": true,
// 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": "style/*", "severity": "off" },
{ "rule": "format/*", "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",
"toml",
"xml",
"gql",
"graphql",
"astro"
]
}
For detailed configurations, please refer to @antfu/eslint-config.