Bitovi ESLint Config: Handpicked Rules to Improve Your Code

Linting is an important step to ensure code quality, and it fits well as an automated process in the development pipeline. Most teams use the default lint configuration provided by their framework, missing opportunities to prevent runtime errors and increase code quality with the extended set of ESLint rules.

Bitovi is happy to announce the @bitovi/eslint-config and @bitovi/eslint-plugin packages!

In pursuit of greater code quality and better standards for Bitovi's clients and the Community, we carefully handpicked the best ESLint rules and created some of our own to fill existing gaps. We built @bitovi/eslint-config upon existing recommended rule sets and selected rules to avoid common pitfalls based on experience with clients and internal projects.

What’s in Bitovi ESLint Config?

Our ESLint-config package has dedicated Angular and React rule sets, but your project can also benefit from other specific rule sets like RxJS. Here are a few of the Angular set rules included in our ESLint config:

Keep code clean by removing unused variables - @typescript-eslint/no-unused-vars
Avoid accessibility issues with keyboard navigation - @angular-eslint/template/no-positive-tabindex
Ensure elements with click event bindings are accessible - @angular-eslint/template/click-events-have-key-events
Ensure component classes with click event bindings are accessible - @bitovi/host-listener-click-events-have-key-events

Start harnessing the full extent of Bitovi’s recommended ESLint rules by following two short steps.

1. Installation

Install the ESLint-config package to get started! Run npm i -D @bitovi/eslint-config, which is short for npm install --save-dev @bitovi/eslint-config.

2. Usage

Once installation is done, you can add any of the rules provided by @bitovi/eslint-config to your project's ESLint config file extends array.

  extends: [
    '@bitovi/eslint-config/angular',
  ]
  
  // or, if you only want a specific rule set like RxJS
  extends: [
    '@bitovi/eslint-config/rules/rxjs',
  ]

What’s next?

We plan to add more custom ESLint rules to @bitovi/eslint-plugin package to help your project be more accessible, have a better SEO and Lighthouse Scores, and more!

Interested in learning more? Take a look at our Roadmap.

Do you have ideas or suggestions? We’d love to hear about them. You can open an issue at @bitovi/eslint-config repository.

If you have any questions, let us know in our Community Slack!