A static analysis linter of jsx and its accessibility to all users.

You'll first need to install ESLint:

$ npm i eslint --save-dev 

Next, install eslint-plugin-jsx-a11y:

$ npm install eslint-plugin-jsx-a11y --save-dev 

Note: If you installed ESLint globally (using the -g flag) then you must also install eslint-plugin-jsx-a11y globally.

Add jsx-a11y to the plugins section of your .eslintrc configuration file. You can omit the eslint-plugin- prefix:

{ "plugins": [ "jsx-a11y" ] }

Then configure the rules you want to use under the rules section.

{ "rules": { "jsx-a11y/rule-name": 2 } }

• img-uses-alt: Enforce that img jsx elements use the alt attribute.
• onclick-uses-role: Enforce that non-interactive, visible elements (such as div) that have click handlers use the role attribute.
• mouse-events-map-to-key-events: Enforce that onMouseOver/onMouseOut are accompanied by onFocus/onBlur for strictly keyboard users.
• use-onblur-not-onchange: Enforce that onBlur is used instead of onChange.
• no-access-key: Enforce that the accessKey prop is not used on any element to avoid complications with keyboard commands used by a screenreader.
• use-label-for: Enforce that label elements have the htmlFor attribute
• redundant-alt: Enforce img alt attribute does not contain the word image, picture, or photo.

eslint-plugin-jsx-a11y is licensed under the MIT License.