eslint-config-noise-react
v0.14.0
Published
A very Noise ESLint React config indeed
Downloads
10
Maintainers
Readme
ESLint Config Noise Node
An opinionated ESLint config based on the Airbnb JavaScript Style Guide for Node.js development.
Plugins
Includes these plugins.
- eslint-plugin-import
- eslint-plugin-prettier
- eslint-plugin-promise
- eslint-plugin-react
- eslint-plugin-react-hooks
- eslint-plugin-unicorn
Install
npm install --save-dev eslint eslint-config-noise-react
npx install-peerdeps --dev eslint-config-noise-react
Configure
There are many ways to configure ESLint in the official documentation.
.eslintrc
{ "extends": ["eslint-config-noise-node"], "root": true };
Components / attributes / labels
Some rules depend on proper configuration. Make sure to configure these when you wrap relevant DOM elements.
Eg. with Gatsby and Next.js you'd use a Link
component instead of an a
element.
.eslintrc.js
const { extendRules } = require('eslint-noise-utils');
const { pluginJsxA11y } = require('eslint-config-noise-react/rules');
module.exports = {
rules: extendRules(pluginJsxA11y, {
'jsx-a11y/anchor-has-content': { components: ['Link'] },
'jsx-a11y/anchor-is-valid': { components: ['Link'], specialLink: ['to'] },
'jsx-a11y/control-has-associated-label': {
controlComponents: [],
labelAttributes: ['label'],
},
'jsx-a11y/heading-has-content': { components: [] },
'jsx-a11y/img-redundant-alt': { components: ['Image'] },
'jsx-a11y/interactive-supports-focus': { tabbable: [] },
'jsx-a11y/label-has-associated-control': {
controlComponents: [],
labelAttributes: [],
labelComponents: [],
},
'jsx-a11y/media-has-caption': { audio: [], track: [], video: [] },
}),
};