Skip to content

ESlint Config

Terminal window
npm i --save-dev eslint@^8.2.0 eslint-plugin-react@^7.28.0 eslint-plugin-import@^2.25.3 eslint-plugin-jsx-a11y@^6.5.1 eslint-plugin-react-hooks@^4.3.0 eslint-config-airbnb-base@latest eslint-config-prettier eslint-plugin-prettier @babel/core @babel/eslint-parser @typescript-eslint/eslint-plugin@latest @babel/preset-env @babel/preset-react
Terminal window
cat > .eslint.json <<EOF
{
"env": {
"browser": true,
"es2021": true,
"es2022": true,
"es6": true,
"jest": true,
"jquery": true,
"node": true
},
"extends": [
"airbnb-base",
"eslint:recommended",
"prettier",
"plugin:prettier/recommended",
"plugin:react/recommended"
],
"globals": {
"$": true,
"jQuery": true
},
"overrides": [
{
"files": ["*.mdx"],
"parser": "eslint-mdx",
"rules": {
"@typescript-eslint/no-unused-vars": "off",
"no-unused-expressions": "off",
"react/jsx-no-undef": "off",
"semi": "off"
}
},
{
"files": ["*.astro"],
"parser": "astro-eslint-parser",
"parserOptions": {
"extraFileExtensions": [".astro"],
"jsx": true,
"parser": "@typescript-eslint/parser"
},
"rules": {
"astro/no-conflict-set-directives": "error",
"astro/no-unused-define-vars-in-style": "error",
"jsx-a11y/anchor-is-valid": "off",
"jsx-a11y/heading-has-content": "off",
"jsx-a11y/no-noninteractive-element-to-interactive-role": "off",
"react/no-unknown-property": "off"
}
},
{
"excludedFiles": [
"assets/js/bundle.js",
"assets/dist/**",
"stencil.conf.js",
"webpack.*.js",
"**/*.min.js",
"**/*.min.js.map",
"src/scripts/tw-elements.js"
],
"files": ["*.js", "*.jsx", "*.ts", "*.tsx", "*.cjs", "*.mjs"]
},
{
"files": ["src/scripts/tw-elements.js"],
"parser": "espree",
"parserOptions": {
"ecmaVersion": "latest",
"sourceType": "module"
}
},
{
"env": {
"node": true
},
"files": ["webpack.*.js", "*.config.js", "*.config.mjs", "*.config.ts"],
"parserOptions": {
"project": "./tsconfig.json",
"sourceType": "module"
},
"rules": {
"import/no-extraneous-dependencies": "off"
}
}
],
"parser": "@babel/eslint-parser",
"parserOptions": {
"babelOptions": {
"presets": ["@babel/preset-env", "@babel/preset-react"]
},
"ecmaFeatures": {
"jsx": true
},
"ecmaVersion": "latest",
"extraFileExtensions": [".mdx"],
"requireConfigFile": false,
"sourceType": "module"
},
"plugins": ["@typescript-eslint", "prettier", "react", "react-hooks", "jsx-a11y"],
"root": true,
"rules": {
"@typescript-eslint/consistent-type-imports": "off",
"@typescript-eslint/no-explicit-any": "warn",
"@typescript-eslint/no-shadow": "warn",
"@typescript-eslint/no-unused-vars": [
"warn",
{
"argsIgnorePattern": "^_",
"destructuredArrayIgnorePattern": "^_",
"varsIgnorePattern": "^_"
}
],
"@typescript-eslint/no-use-before-define": "error",
"@typescript-eslint/no-var-requires": "off",
"block-scoped-var": 0,
"class-methods-use-this": 0,
"consistent-return": 0,
"default-case": 0,
"default-param-last": 0,
"eqeqeq": ["warn", "smart"],
"func-names": 0,
"global-require": 0,
"import/extensions": [
"error",
"ignorePackages",
{
"astro": "always",
"js": "never",
"json": "always",
"jsx": "never",
"mdx": "never",
"ts": "never",
"tsx": "never"
}
],
"import/first": 0,
"import/no-cycle": 0,
"import/no-named-as-default": 0,
"import/no-named-as-default-member": 0,
"import/no-unresolved": [
"error",
{
"ignore": [
"@astrojs/image/components",
"^astro:",
"^@/",
"astro/config",
"@astrojs/react",
"@astrojs/tailwind",
"@astrojs/cloudflare",
"@astrojs/partytown",
"@astrojs/mdx"
]
}
],
"import/order": "off",
"sort-imports": "off",
"import/prefer-default-export": "off",
"simple-import-sort/imports": "off",
"simple-import-sort/exports": "warn",
"jsx-a11y/anchor-is-valid": [
"error",
{
"aspects": ["invalidHref", "preferButton"],
"components": ["Link"],
"specialLink": ["to", "hrefLeft", "hrefRight"]
}
],
"jsx-a11y/no-redundant-roles": "off",
"linebreak-style": ["error", "unix"],
"max-classes-per-file": 0,
"max-len": 0,
"max-lines": "off",
"new-cap": 0,
"newline-per-chained-call": 0,
"no-alert": 0,
"no-cond-assign": 0,
"no-const-assign": 0,
"no-constructor-return": 0,
"no-empty-function": 0,
"no-inner-declarations": 0,
"no-loop-func": 0,
"no-mixed-operators": 0,
"no-mixed-spaces-and-tabs": 2,
"no-multi-assign": 0,
"no-multi-str": 0,
"no-new": 0,
"no-param-reassign": 0,
"no-plusplus": 0,
"no-prototype-builtins": 0,
"no-redeclare": 0,
"no-restricted-globals": 0,
"no-restricted-syntax": 0,
"no-shadow": "off",
"no-template-curly-in-string": 0,
"no-undef": 0,
"no-undef-init": 0,
"no-underscore-dangle": 0,
"no-unused-expressions": 0,
"no-unused-vars": "off",
"no-use-before-define": "off",
"no-useless-concat": 0,
"no-useless-constructor": 0,
"no-useless-escape": 0,
"no-useless-return": 0,
"no-var": "error",
"object-shorthand": 0,
"one-var": 0,
"one-var-declaration-per-line": 0,
"operator-assignment": 0,
"prefer-arrow-callback": 0,
"prefer-const": "warn",
"prefer-destructuring": 0,
"prefer-rest-params": 0,
"prefer-spread": 0,
"prettier/prettier": [
"error",
{
"printWidth": 120,
"singleQuote": true,
"tabWidth": 4,
"trailingComma": "all"
}
],
"quote-props": 0,
"quotes": [
"error",
"single",
{
"avoidEscape": true
}
],
"react-hooks/exhaustive-deps": "warn",
"react-hooks/rules-of-hooks": "error",
"react/no-unescaped-entities": "off",
"react/prop-types": "off",
"react/react-in-jsx-scope": "off",
"semi": ["error", "always"],
"sonarjs/cognitive-complexity": 0,
"sonarjs/prefer-optional-chain": 0,
"vars-on-top": 0
},
"settings": {
"import/resolver": {
"node": {
"extensions": ["*.js", "*.jsx", "*.ts", "*.tsx", "*.cjs", "*.mjs", ".astro"]
}
},
"mdx": {
"code-blocks": true
},
"react": {
"version": "detect"
}
}
}
EOF

Terminal window
npm install --save-dev eslint eslint-config-airbnb-base eslint-config-prettier eslint-plugin-jsx-a11y eslint-plugin-prettier prettier-eslint eslint-plugin-astro eslint-plugin-react eslint-plugin-react-hooks @typescript-eslint/eslint-plugin @typescript-eslint/parser eslint eslint-mdx eslint-plugin-mdx

Terminal window
npm i --save-dev eslint eslint-config-airbnb-base eslint-config-prettier eslint-plugin-jsx-a11y eslint-plugin-prettier prettier-eslint
Terminal window
npm i --save-dev eslint eslint-plugin-astro
Terminal window
npm i --save-dev eslint eslint-plugin-react eslint-plugin-react-hooks
Terminal window
npm i --save-dev eslint @typescript-eslint/eslint-plugin @typescript-eslint/parser
Terminal window
npm i --save-dev eslint eslint-mdx eslint-plugin-mdx

Terminal window
cat > .eslintrc.json <<EOF
{
"env": {
"browser": true,
"es2021": true,
"es2022": true,
"es6": true,
"jest": true,
"jquery": true,
"node": true
},
"extends": [
"plugin:jsx-a11y/recommended",
"airbnb-base",
"eslint:recommended",
"prettier",
"plugin:react-hooks/recommended",
"plugin:@typescript-eslint/recommended",
"plugin:astro/recommended",
"plugin:react/recommended",
"plugin:mdx/recommended",
"plugin:prettier/recommended"
],
"globals": {
"$": true,
"jQuery": true
},
"overrides": [
{
"files": ["*.mdx"],
"parser": "eslint-mdx",
"rules": {
"@typescript-eslint/no-unused-vars": "off",
"no-unused-expressions": "off",
"react/jsx-no-undef": "off",
"semi": "off"
}
},
{
"files": ["*.astro"],
"parser": "astro-eslint-parser",
"parserOptions": {
"extraFileExtensions": [".astro"],
"jsx": true,
"parser": "@typescript-eslint/parser"
},
"rules": {
"astro/no-conflict-set-directives": "error",
"astro/no-unused-define-vars-in-style": "error",
"jsx-a11y/anchor-is-valid": "off",
"jsx-a11y/heading-has-content": "off",
"jsx-a11y/no-noninteractive-element-to-interactive-role": "off",
"react/no-unknown-property": "off"
}
},
{
"excludedFiles": [
"assets/js/bundle.js",
"assets/dist/**",
"stencil.conf.js",
"webpack.*.js",
"**/*.min.js",
"**/*.min.js.map",
"src/scripts/tw-elements.js"
],
"files": ["*.js", "*.jsx", "*.ts", "*.tsx", "*.cjs", "*.mjs"]
},
{
"files": ["src/scripts/tw-elements.js"],
"parser": "espree",
"parserOptions": {
"ecmaVersion": "latest",
"sourceType": "module"
}
},
{
"env": {
"node": true
},
"files": ["webpack.*.js", "*.config.js", "*.config.mjs", "*.config.ts"],
"parserOptions": {
"project": "./tsconfig.json",
"sourceType": "module"
},
"rules": {
"import/no-extraneous-dependencies": "off"
}
}
],
"parser": "@typescript-eslint/parser",
"parserOptions": {
"ecmaFeatures": {
"jsx": true
},
"ecmaVersion": "latest",
"extraFileExtensions": [".mdx"],
"requireConfigFile": false,
"sourceType": "module"
},
"plugins": ["@typescript-eslint", "prettier", "react", "react-hooks", "jsx-a11y"],
"root": true,
"rules": {
"@typescript-eslint/consistent-type-imports": "off",
"@typescript-eslint/no-explicit-any": "warn",
"@typescript-eslint/no-shadow": "warn",
"@typescript-eslint/no-unused-vars": [
"warn",
{
"argsIgnorePattern": "^_",
"destructuredArrayIgnorePattern": "^_",
"varsIgnorePattern": "^_"
}
],
"@typescript-eslint/no-use-before-define": "error",
"@typescript-eslint/no-var-requires": "off",
"block-scoped-var": 0,
"class-methods-use-this": 0,
"consistent-return": 0,
"default-case": 0,
"default-param-last": 0,
"eqeqeq": ["warn", "smart"],
"func-names": 0,
"global-require": "off",
"import/extensions": [
"error",
"ignorePackages",
{
"astro": "always",
"js": "never",
"json": "always",
"jsx": "never",
"mdx": "never",
"ts": "never",
"tsx": "never"
}
],
"import/first": 0,
"import/no-cycle": 0,
"import/no-named-as-default": 0,
"import/no-named-as-default-member": 0,
"import/no-unresolved": [
"error",
{
"ignore": [
"@astrojs/image/components",
"^astro:",
"^@/",
"astro/config",
"^@astrojs/",
"@astrojs/react",
"@astrojs/tailwind",
"@astrojs/cloudflare",
"@astrojs/partytown",
"@astrojs/mdx",
"@astrojs/sitemap",
"@astrojs/starlight",
"@astrojs/vite",
"@tailwindcss/vite",
"@astrojs/starlight/components/Content",
"@astrojs/starlight/components/PageFrame",
"@astrojs/starlight/components/PageTitle",
"@astrojs/starlight/components/Sidebar"
]
}
],
"import/order": "off",
"sort-imports": "off",
"import/prefer-default-export": "off",
"simple-import-sort/imports": "off",
"simple-import-sort/exports": "warn",
"jsx-a11y/anchor-is-valid": [
"error",
{
"aspects": ["invalidHref", "preferButton"],
"components": ["Link"],
"specialLink": ["to", "hrefLeft", "hrefRight"]
}
],
"jsx-a11y/no-redundant-roles": "off",
"linebreak-style": ["error", "unix"],
"max-classes-per-file": 0,
"max-len": 0,
"max-lines": "off",
"new-cap": 0,
"newline-per-chained-call": 0,
"no-alert": 0,
"no-cond-assign": 0,
"no-const-assign": 0,
"no-constructor-return": 0,
"no-empty-function": 0,
"no-inner-declarations": 0,
"no-loop-func": 0,
"no-mixed-operators": 0,
"no-mixed-spaces-and-tabs": 2,
"no-multi-assign": 0,
"no-multi-str": 0,
"no-new": 0,
"no-param-reassign": 0,
"no-plusplus": 0,
"no-prototype-builtins": 0,
"no-redeclare": 0,
"no-restricted-globals": 0,
"no-restricted-syntax": 0,
"no-shadow": "off",
"no-template-curly-in-string": 0,
"no-undef": 0,
"no-undef-init": 0,
"no-underscore-dangle": 0,
"no-unused-expressions": 0,
"no-unused-vars": "off",
"no-use-before-define": "off",
"no-useless-concat": 0,
"no-useless-constructor": 0,
"no-useless-escape": 0,
"no-useless-return": 0,
"no-var": "error",
"object-shorthand": 0,
"one-var": 0,
"one-var-declaration-per-line": 0,
"operator-assignment": 0,
"prefer-arrow-callback": 0,
"prefer-const": "warn",
"prefer-destructuring": 0,
"prefer-rest-params": 0,
"prefer-spread": 0,
"prettier/prettier": [
"error",
{
"printWidth": 120,
"singleQuote": true,
"tabWidth": 4,
"trailingComma": "all"
}
],
"quote-props": 0,
"quotes": [
"error",
"single",
{
"avoidEscape": true
}
],
"react-hooks/exhaustive-deps": "warn",
"react-hooks/rules-of-hooks": "error",
"react/no-unescaped-entities": "off",
"react/prop-types": "off",
"react/react-in-jsx-scope": "off",
"semi": ["error", "always"],
"sonarjs/cognitive-complexity": 0,
"sonarjs/prefer-optional-chain": 0,
"vars-on-top": 0
},
"settings": {
"import/resolver": {
"node": {
"extensions": ["*.js", "*.jsx", "*.ts", "*.tsx", "*.cjs", "*.mjs", ".astro"]
}
},
"mdx": {
"code-blocks": true
},
"react": {
"version": "detect"
}
}
}
EOF

Terminal window
cat > .eslintignore <<EOF
dist/
.output/
.astro/
node_modules/
public/
.cache/
*.d.ts
EOF