eslint-plugin

An ESLint plugin intended for use with Hack4Impact UIUC projects.

Installation

You'll first need to install ESLint:

npm install eslint --save-dev

Next, install @hack4impact-uiuc/eslint-plugin:

npm install @hack4impact-uiuc/eslint-plugin --save-dev

Usage

To enable @hack4impact-uiuc/eslint-plugin, you'll need to create a .eslintrc.json file for ESLint configuration.

This plugin abstracts away configuration from the user, with three different configs drawing from eslint-plugin-import, @typescript-eslint/eslint-plugin, eslint-plugin-jsx-a11y, eslint-plugin-react, and eslint-plugin-react-hooks:

base: for use with any JavaScript project
react: for use with React projects
typescript for use with projects using TypeScript

For a JavaScript-only React app all you'll need to have in your .eslintrc.json file is the following:

{
  "plugins": ["@hack4impact-uiuc"],
  "extends": ["plugin:@hack4impact-uiuc/base", "plugin:@hack4impact-uiuc/react"]
}

If your app uses TypeScript at all, you'll want to use @typescript-eslint/eslint-plugin by extending the typescript config as follows (this example is for a React app):

{
  "plugins": ["@hack4impact-uiuc"],
  "extends": [
    "plugin:@hack4impact-uiuc/base",
    "plugin:@hack4impact-uiuc/react",
    "plugin:@hack4impact-uiuc/typescript"
  ]
}

If you need to modify or disable specific rules, you can do so in the rules section of your .eslintrc.json file. For example, if you wish to disable no-redundant-functions, add the following to your .eslintrc.json file:

{
  "rules": {
    "@hack4impact-uiuc/no-redundant-functions": "off"
  }
}

Note that disabling rules from plugins requires prefixing them with their corresponding scope and/or plugin name.

Supported Rules

Rules

Rule	Default	Fixable
no-access-state-after-set	🚩	❌
no-null-ternary	🚩	❌
no-redundant-functions	🚩	❌

Key

Symbol	Meaning
🚩	Error
⚠️	Warning
✖️	Off
✔️	Fixable and autofix-enabled
❌	Not fixable