@cabify/eslint-config

ESLint config for both TS and JS, Cabify way.

Installation

npm i -D @cabify/eslint-config eslint prettier

or

yarn add --dev @cabify/eslint-config eslint prettier

Usage

1. Create a .eslint.config.js file at the root of your project:

import recommended from '@cabify/eslint-config';
/* Define an object for local configuration. 
/ You can add your custom configuration and override existing rules here before exporting it.
const localConfig = {};
export default [...recommended, localConfig];
*/
export default [...recommended];

2. Add the lint task into your package.json:

...
"scripts": {
  ...
  "lint:fix": "eslint ./ --fix",
  "lint": "eslint ./",
  ...
}

3. Add a .globalIgnores in your eslint.config.js to avoid checking unwanted files:

// https://eslint.org/docs/latest/use/configure/configuration-files#globally-ignoring-files-with-ignores
const globalIgnores = {
  ignores: [
    'dist',
    'node_modules/*',
    'storybook-static/*',
    'test/*',
    'build',
    'scripts',
    'webpack',
  ],
};
export default [...recommended, globalIgnores];

Formatting

The recomended configuration does not include formatting rules, as using the Prettier binary is quicker and brings more benefits. To format the files from your app a and checking them are properly formatted you can add the following scripts to your package.json file:

...
"scripts": {
  ...
  "format": "prettier --write .",
  "format:check": "prettier --check .",
  ...
}

Setup for TypeScript

const localConfigs = {
  languageOptions: {
    parserOptions: {
      project: './tsconfig.json',
      ecmaVersion: 2020,
    },
  },
  settings: {
    'import/resolver': {
      typescript: {
        alwaysTryTypes: true, // always try to resolve types under `<root>@types` directory even it doesn't contain any source code, like `@types/unist`
        project: '<root>/tsconfig.json',
      },
    },
  },
};

export default [...recommended, localConfigs];

3. Add a ./tsconfig.eslint.json to the root of your project. NOTE: it is important that your tsconfig.eslint.json file includes the same files that you are going to lint, or it will fail and make linting so slow.

{
  "extends": "./tsconfig.json",
  "include": ["src/**/*", "test/**/*"] // remember to import also your test files if you want to lint them
}

A note on performance in TS projects

There is an known issue that may affect linting times in projects with TS. If you note that your linting time is not acceptable, there is a workaround to improve it a lot, but it implies to disable some rules. If you can live without them, just make these changes in your .eslintrc config:

{
  ...
  // remove the "project" field (if you don't have any other parserOptions you can remove the full section)
  "parserOptions": {},
  "rules": {
    // this rules depend on project field, so they must be disabled to make linting much faster
    "@typescript-eslint/await-thenable": "off",
    "@typescript-eslint/no-misused-promises": "off",
    "@typescript-eslint/no-unnecessary-type-assertion": "off",
    "@typescript-eslint/prefer-includes": "off",
    "@typescript-eslint/prefer-regexp-exec": "off",
    "@typescript-eslint/prefer-string-starts-ends-with": "off",
    "@typescript-eslint/require-await": "off",
    "@typescript-eslint/unbound-method": "off"
  }
}

Publish a new version

• Update CHANGELOG with new features, breaking changes, etc
• Check you're in main branch and everything is up-to-date.
• Run yarn publish:<major|minor|patch> or yarn publish:canary for canary versions.
• Run git push && git push --tags
• Check all test actions triggered after previous push are ✔️.
• Go to create a new release, select previously pushed tag and write a Title.
• Check the action for publish the npm has finished with success.
• Check on npm package webpage, the version has been published successfully under latest tag.

This will trigger a workflow on Github which will publish to npm eventually.

Contributors ✨

Thanks goes to these wonderful people (emoji key):

Aarón García Hervás 💻	Alejandro 💻	Alejandro Gallardo Escobar 💻	Alejandro León 💻	Alex Temina 💻	Arian Zargaran 💻	Carlos Castillo 💻
Christian 💻	Crismmgg 💻	David Asensio Cañas 💻	Francisco Sánchez 💻	Javier López 💻	Jesús Merino Parra 💻	Leire Rico 💻
Ricardo Boluda 💻	Rodrigo 💻	Sergio Ramirez 💻	Valentin Berlin 💻	Yago Quiñoy Lobariñas 💻	alejandromolero 💻

This project follows the all-contributors specification. Contributions of any kind welcome!