Skip to content

github/eslint-plugin-github

main
Switch branches/tags

Name already in use

A tag already exists with the provided branch name. Many Git commands accept both tag and branch names, so creating this branch may cause unexpected behavior. Are you sure you want to create this branch?
Code

Latest commit

Files

Permalink
Failed to load latest commit information.

eslint-plugin-github

Installation

npm install --save-dev eslint eslint-plugin-github

Setup

Add github to your list of plugins in your ESLint config.

JSON ESLint config example:

{
  "plugins": ["github"]
}

Extend the configs you wish to use.

JSON ESLint config example:

{
  "extends": ["plugin:github/recommended"]
}

The available configs are:

  • internal
    • Rules useful for github applications.
  • browser
    • Useful rules when shipping your app to the browser.
  • react
    • Recommended rules for React applications.
  • recommended
    • Recommended rules for every application.
  • typescript
    • Useful rules when writing TypeScript.

Component mapping (Experimental)

Note: This is experimental and subject to change.

The react config includes rules which target specific HTML elements. You may provide a mapping of custom components to an HTML element in your eslintrc configuration to increase linter coverage.

For each component, you may specify a default and/or props. default may make sense if there's a 1:1 mapping between a component and an HTML element. However, if the HTML output of a component is dependent on a prop value, you can provide a mapping using the props key. To minimize conflicts and complexity, this currently only supports the mapping of a single prop type.

{
  "settings": {
    "github": {
      "components": {
        "Box": {"default": "p"},
        "Link": {"props": {"as": {"undefined": "a", "a": "a", "button": "button"}}}
      }
    }
  }
}

This config will be interpreted in the following way:

  • All <Box> elements will be treated as a p element type.
  • <Link> without a defined as prop will be treated as a a.
  • <Link as='a'> will treated as an a element type.
  • <Link as='button'> will be treated as a button element type.
  • <Link as='summary'> will be treated as the raw Link type because there is no configuration set for as='summary'.

Rules

๐Ÿ’ผ Configurations enabled in.
๐Ÿ” Set in the browser configuration.
๐Ÿ” Set in the internal configuration.
โš›๏ธ Set in the react configuration.
โœ… Set in the recommended configuration.
๐Ÿ”ง Automatically fixable by the --fix CLI option.
โŒ Deprecated.

Nameย ย ย ย ย ย ย ย ย ย ย ย ย ย ย ย ย ย ย ย ย ย ย ย ย ย ย ย ย  Description ๐Ÿ’ผ ๐Ÿ”ง โŒ
a11y-aria-label-is-well-formatted [aria-label] text should be formatted as you would visual text. โš›๏ธ
a11y-no-generic-link-text disallow generic link text โŒ
array-foreach enforce for..of loops over Array.forEach โœ…
async-currenttarget disallow event.currentTarget calls inside of async functions ๐Ÿ”
async-preventdefault disallow event.preventDefault calls inside of async functions ๐Ÿ”
authenticity-token disallow usage of CSRF tokens in JavaScript ๐Ÿ”
get-attribute disallow wrong usage of attribute names ๐Ÿ” ๐Ÿ”ง
js-class-name enforce a naming convention for js- prefixed classes ๐Ÿ”
no-blur disallow usage of Element.prototype.blur() ๐Ÿ”
no-d-none disallow usage the d-none CSS class ๐Ÿ”
no-dataset enforce usage of Element.prototype.getAttribute instead of Element.prototype.datalist ๐Ÿ”
no-dynamic-script-tag disallow creating dynamic script tags โœ…
no-implicit-buggy-globals disallow implicit global variables โœ…
no-inner-html disallow Element.prototype.innerHTML in favor of Element.prototype.textContent ๐Ÿ”
no-innerText disallow Element.prototype.innerText in favor of Element.prototype.textContent ๐Ÿ” ๐Ÿ”ง
no-then enforce using async/await syntax over Promises โœ…
no-useless-passive disallow marking a event handler as passive when it has no effect ๐Ÿ” ๐Ÿ”ง
prefer-observers disallow poorly performing event listeners ๐Ÿ”
require-passive-events enforce marking high frequency event handlers as passive ๐Ÿ”
role-supports-aria-props Enforce that elements with explicit or implicit roles defined contain only aria-* properties supported by that role. โš›๏ธ
unescaped-html-literal disallow unescaped HTML literals ๐Ÿ”