Neon ESLint Config
Installation
neon comes as a complete package, none of the configs require any additional dependecies.
npm install eslint eslint-config-neon
yarn add eslint eslint-config-neon
pnpm add eslint eslint-config-neonUsage
This package includes the following configurations:
-
neon/common– The neon code style guide. -
neon/angular– for usage with Angular. -
neon/astro– for usage with Astro. -
neon/browser– for usage with DOM and other browser APIs. -
neon/cypress– for usage with Cypress. -
neon/edge– for usage with an edge runtime Vercel, Cloudflare Workers, or others. -
neon/jsx– for usage with JSX (with or without React). -
neon/jsx-a11y– for usage with JSX (with or without React) and want to include accessibility checks. -
neon/module– for usage with ESM modules. -
neon/next– for usage with Next.js. -
neon/no-deprecated- for reporting deprecated APIs (very slow on big repos, especially monorepos). -
neon/node– for usage with Node.js. -
neon/prettier– for usage with Prettier. -
neon/react– for usage with React. -
neon/rxjs– for usage with RxJS. -
neon/rxjs-angular– for usage RxJS and Angular. -
neon/svelte– for usage with Svelte. -
neon/svelte-typescript– for usage with Svelte and TypeScript. -
neon/typescript– for usage with TypeScript. -
neon/vue– for usage with Vue. -
neon/vue-typescript– for usage with Vue and TypeScript.
Configuration
{
"root": true,
"extends": ["neon/common", "neon/node", "neon/typescript", "neon/prettier"],
"parserOptions": {
"project": "./tsconfig.json"
},
"ignorePatterns": ["**/dist/*"]
}Node.js
{
"root": true,
"root": true,
"extends": ["neon/common", "neon/node", "neon/typescript", "neon/prettier"],
"parserOptions": {
"project": "./tsconfig.json"
},
"ignorePatterns": ["**/dist/*"]
}React / Next
React:
{
"root": true,
"extends": [
"neon/common",
"neon/browser",
"neon/node",
"neon/typescript",
"neon/react",
"neon/next",
"neon/edge",
"neon/prettier"
],
"settings": {
"react": {
"version": "detect"
}
},
"parserOptions": {
"project": "./tsconfig.json"
},
"ignorePatterns": ["**/dist/*"],
"rules": {
"react/react-in-jsx-scope": 0,
"react/jsx-filename-extension": [1, { "extensions": [".tsx"] }]
}
}Next:
{
"root": true,
"extends": [
"neon/common",
"neon/browser",
"neon/node",
"neon/typescript",
"neon/react",
"neon/next",
"neon/edge",
"neon/prettier"
],
"settings": {
"react": {
"version": "detect"
}
},
"parserOptions": {
"project": "./tsconfig.json"
},
"ignorePatterns": ["**/dist/*"],
"rules": {
"react/react-in-jsx-scope": 0,
"react/jsx-filename-extension": [1, { "extensions": [".tsx"] }]
}
}Astro
{
"root": true,
"extends": [
"neon/common",
"neon/browser",
"neon/node",
"neon/typescript",
"neon/react",
"neon/astro",
"neon/prettier"
],
"settings": {
"react": {
"version": "detect"
}
},
"parserOptions": {
"project": "./tsconfig.json"
},
"ignorePatterns": ["**/dist/*"],
"rules": {
"react/jsx-filename-extension": [1, { "extensions": [".tsx", ".astro"] }]
}
}Vue 2/3 / Nuxt
{
"root": true,
"extends": [
"neon/common",
"neon/browser",
"neon/node",
"neon/typescript",
"neon/vue",
"neon/vue-typescript",
"neon/prettier"
],
"parserOptions": {
"project": "./tsconfig.json"
},
"ignorePatterns": ["**/dist/*"]
}Angular / NX
{
"root": true,
"parserOptions": {
"project": "./tsconfig.json"
},
"ignorePatterns": ["!**/*"],
"overrides": [
{
"files": ["*.ts"],
"extends": [
"neon/common",
"neon/browser",
"neon/node",
"neon/typescript",
"neon/angular",
"neon/rxjs",
"neon/rxjs-angular",
"neon/prettier"
]
},
{
"files": ["*.html"],
"extends": ["neon/angular"]
}
]
}Usage with Prettier
Prettier and neon are already compatible. Just add it as the last config in your extends configuration, e.g.
{
"extends": ["neon/common", "neon/node", "neon/typescript", "neon/prettier"]
}This configuration disables all neon rules that conflict with Prettier.