@abios/eslint-plugin

Abios ESLint Configurations

Usage no npm install needed!

<script type="module">
  import abiosEslintPlugin from 'https://cdn.skypack.dev/@abios/eslint-plugin';
</script>

README

Abios logo

@abios/eslint-plugin

Abios ESLint Configurations

Installation

You'll first need to install ESLint if it isnt installed already:

yarn add --dev eslint

Next, install @abios/eslint-plugin:

yarn add --dev @abios/eslint-plugin

Usage

Enable a configuration by extending your project's .eslintrc with any of the configurations available under Provided Configurations.
For example, the following configuration will extend the React config:

{
  "extends": [
    "plugin:@abios/react"
  ]
}

You can also add augmenting configurations on top of your core configuration by adding these augmentations to the array. For example, the following configuration would provide a TypeScript base that is augmented by Prettier:

{
  "extends": [
    "plugin:@abios/typescript",
    "plugin:@abios/prettier"
  ]
}

This is useful when you want to disable rules that conflict in projects using Prettier.
Note: The configuration order does matter and prettier should always be imported last.

Provided Configurations

This plugin provides the following core configurations:

  • react: Use this for React projects.
  • typescript: Use this for TypeScript projects. You will need to specify a path to your tsconfig.json file in the "project" property of "parserOptions".

The following example provides all of the TypeScript rules, assuming the tsconfig.json is in the same directory as you ESlint configuration.

{
  "extends": [
    "plugin:@abios/typescript",
  ],
  "parserOptions": {
    "project": "./tsconfig.json"
  }
}

Note: If your project uses both React and TypeScript importing the @abios/typescript configuration is sufficient.