@crystal-ball/eslint-config-eloquence

Crystal Ball ESLint Configs

Installing:

Add the package and Prettier as a dev dependencies to your project:

npm i eslint-config-healthsparq prettier -D

We recommend adding Prettier as a project dependency. (Some editors will only use Prettier as a dependency if it is in the package.json)

If you are using the web configs, install the webpack resolver as well:

npm i eslint-import-resolver-webpack -D

Flow

Static typing using flow is supported through the eslint-plugin-import package.

Usage

Extending this package's config will handle setting the base parserOptions, parser, plugins and env. There are seperate configs for Node projects and web projects to handle turning on/off features like JSX, webpack resolving, .mjs file extensions, etc. The configs are node and web and can be extended like so:

Webpack Project

// .eslintrc.js
module.exports = { extends: '@crystal-ball/eloquence/web' }

Node Project

// .eslintrc.js
module.exports = { extends: '@crystal-ball/eloquence/node' }

Overriden Rules

The only Airbnb code quality rule that is overriden is setting no-use-before-define to { functions: false }. This allows propTypes of stateless functional components to be decalred before the component defintion using a function declarartion:

Radical.propTypes = {
  name: string.isRequired
}

export default function Radical({ name }) {
 return <h1>{name} is RADICAL!</h1>
}

This lets us always declare our prop types before the component definition, which is helpful when evaluating some new component.

Dependencies

All dependencies required for running ESLint will be installed as dependencies of this package. This ensures that there are no conflicting versions of ESLint in a consuming project's dependencies. Installed dependencies include:

• eslint
• babel-eslint
• eslint-config-airbnb
• eslint-config-prettier
• eslint-plugin-flowtype
• eslint-plugin-import
• eslint-plugin-jsx-a11y
• eslint-plugin-prettier
• eslint-plugin-react

TypeScript

Linting for TypeScript is an opt-in. First, add the ESLint TS parser:

npm i typescript-eslint-parser

Then extend the TyepScript configuration:

// .eslintrc.js
module.exports = {
  extends: '@crystal-ball/eloquence/typescript'
}

Changelog

15.2.0 (2020-09-13)

✨ Update

• Disable import/no-unassigned-imports ⚙️ (#244)(f5eae35), closes #244