@bonniernews/eslint-config

@bonniernews/eslint-config

Basic ESLint rules used by Bonnier News. The configuration works both with CommonJS and ES6 modules, and the appropriate setup will be used by looking at the projects package.json type property.

For Node versions that support it (version 16 and above), the es2022 environment will also be activated. Otherwise es2021 will be used.

Table of contents

• @bonniernews/eslint-config
  • Table of contents
  • Usage
    • Configuring all rules
    • JavaScript configuration
    • TypeScript configuration
    • React configuration
    • Test configuration
    • Typed react configuration
    • Global ignores
    • Globals
  • Migrating from 1.X to 2.X
  • Running eslint
  • Usage in an existing project
  • Usage with Prettier
  • Enable format on save
  • Changelog
  • Publishing a new version
  • License

Usage

Install eslint and @bonniernews/eslint-config:

npm install --save-dev eslint @bonniernews/eslint-config

Configuring all rules

Configures all rules, js, ts, tsx, jsx and test rules.

To activate the config, you need to add the following to your eslint.config.js-file:

"use strict";

module.exports = require("@bonniernews/eslint-config");

JavaScript configuration

To activate the config, you need to add the following to your eslint.config.js-file:

"use strict";

module.exports = require("@bonniernews/eslint-config/js");

TypeScript configuration

To activate the config, you need to add the following to your eslint.config.js-file:

"use strict";

module.exports = require("@bonniernews/eslint-config/ts");

React configuration

To activate the config, you need to add the following to your eslint.config.js-file:

"use strict";

module.exports = require("@bonniernews/eslint-config/jsx");

Test configuration

Adds useful plugins and globals for testing with mocha-cakes-2 + chai.

To activate the config, you need to add the following to your eslint.config.js-file (for js):

"use strict";

module.exports = require("@bonniernews/eslint-config/test-js");

or the following (for ts):

"use strict";

module.exports = require("@bonniernews/eslint-config/test-ts");

Typed react configuration

To activate the config, you need to add the following to your eslint.config.js-file:

"use strict";

module.exports = require("@bonniernews/eslint-config/tsx");

Global ignores

To activate this config (in addition to other config(s), using it alone makes no sense), add the following:

"use strict";

const ignores = require("@bonniernews/eslint-config/ignores");

module.exports = [
  ...allYourGoodConfigs,
  ignores
];

Globals

Globals for browsers, etc. that may be needed.

"use strict";

const globals = require("@bonniernews/eslint-config/globals");

module.exports = [
  ...allYourGoodConfigs,
  { files: [ "assets/scripts" ], languageOptions: { globals: globals.browser } }
];

Migrating from 1.X to 2.X

2.X introduces eslint 9 which has a different configuration format. It is recommended to read the eslint migration guide.

A major change from eslint 8 is that only one eslint.config.js file will be used, placing a specific configuration file in a folder will not behave in the same way as in 8 where it would inherit the configuration from files from the root folder, and the new recommendation is to just have one eslint.config.js at the root of the repository.

One major change from eslint 8 is that in order for ignores to be global they need to be added in a single config at the root level. If you just use the @bonniernews/eslint-config you will have it included, but if you construct your own set of rules you need to add it manually to your config file, otherwise eslint will run on files in terraform directories and such.

The different rule sets have changed name and behaviour:

• @bonniernews/eslint-config will import configs and apply them to the respective targets
• @bonniernews/eslint-config/js config for js files
• @bonniernews/eslint-config/ts config for ts files
• @bonniernews/eslint-config/jsx config for jsx files
• @bonniernews/eslint-config/tsx config for tsx files
• @bonniernews/eslint-config/test-js config for test js files using mocha-cakes-2 and chai
• @bonniernews/eslint-config/test-ts config for test ts files using mocha-cakes-2 and chai
• @bonniernews/eslint-config/ignores global ignores

Running eslint

Run with:

npx eslint .

Usage in an existing project

• We advice to remove any husky hooks that uses libraries such as pretty-quick from your package.json
• Subsequently remove any use of pretty-quick if possible.
• Remove any previous use of sharable ESLint configs from package.json, i.e.:
  • eslint-config-airbnb
  • eslint-config-google
  • eslint-config-prettier
• Remove eslint-plugin-prettier from package.json
• If you get errors similar to the ones below, please update the eslint dependancy.
  • Definition for rule 'no-nonoctal-decimal-escape' was not found
  • Definition for rule 'no-unsafe-optional-chaining' was not found
• If you still have issues; try updating npm (if you use nvm nvm install-latest-npm) & prettier as-well
• Remove any 'eslint-disable-line no-unused-expressions' directives added because of chai assertions, they are not needed anymore (eslint-plugin-chai-friendly is used in test).
• Remove any globals and special rules related to mocha-cakes-2 in your test configuration, they already exist in the @bonniernews/eslint-config/test and @bonniernews/eslint-config/all configs.

Once you complete the steps above run the following:

npx eslint . --fix

Usage with Prettier

If you want to use Prettier, run it before eslint. ESLint should be the final judge, i.e. run:

npx prettier --save .
npx eslint . --fix

This will format the entire code base according to the rules of Prettier and the config.

Enable format on save

• Visual Studio Code

Changelog

Can be found here.

Publishing a new version

• Prepare the new version
• Fill out the CHANGELOG
• Ensure that package-lock, et al are up-to-date
• Commit
• Tag
• Publish, when publishing ensure that you have a token in ~/.npmrc with auth for npm.pkg.github.com as we publish both to our own registry and to the npm registry

License

Released under the MIT license.

Changelog

2.0.2

• Fixed bad docs.