@amedia/eslint-config-base

@amedia/eslint-config-base

Common ESLint/Prettier configuration for javascript Extends AirBnb's Base configuration: https://github.com/airbnb/javascript/tree/master/packages/eslint-config-airbnb-base

Installation

To test this package:

Install the package with (change the version to the version in package.json)

NPM

With npm 5+

This is a cool tool that installs all dependencies you need in devDependencies to get going.

npx install-peerdeps --dev @amedia/eslint-config-base@3.5.0-alpha.1

OR

If you want a prefer manual approach then install the correct versions of each peerDependency package, which are listed by the command:

npm info "@amedia/eslint-config-base@3.5.0-alpha.1" peerDependencies
npm install --save-dev @amedia/eslint-config-base@3.5.0-alpha.1

yarn

yarn add  @amedia/eslint-config-base@3.5.0-alpha.1 -D

Install the correct versions of each peerDependency package, which are listed by the command:

npm info "@amedia/eslint-config-base@3.5.0-alpha.1" peerDependencies

Usage

There are a few ways to include the eslint config in your project.

Make sure you dont have any other settings for eslint or prettier already in your editor workspace or global. Restart your editor if you dont see it working immediately (known issue for VS Code)

Select one of the options below:

Using your package.json:

{
  "eslintConfig": {
    "extends": "@amedia/eslint-config-base"
  }
}

Using your .eslintrc:

{
  "extends": "@amedia/eslint-config-base"
}

or .eslintrc.js:

module.exports = {
  extends: '@amedia/eslint-config-base',
};

Prettier Config

This is how you use or extend the @amedia/eslint-config-base prettier config in your app: either create a .prettierrc, or add a line to the package.json file.

{
  "prettier": "@amedia/eslint-config-base/prettier.config"
}

Create a file named prettier.config.js Again, remove other prettier config files locally in your project or editor.

module.exports = require('@amedia/eslint-config-base/prettier.config');

Using VSCODE?

Install extenstion for VS Code ESLint extension (Dirk Baumer) (https://marketplace.visualstudio.com/items?itemName=dbaeumer.vscode-eslint) and Prettier - Code formatter (https://marketplace.visualstudio.com/items?itemName=esbenp.prettier-vscode)

create a folder .vscode, and a file settings.json with the following:

{
    "editor.defaultFormatter": "esbenp.prettier-vscode",

    "editor.formatOnSave": true,
    "[yaml]": {
        "editor.formatOnSave": false
    },
    "[javascript]": {
        "editor.detectIndentation": true
    },
    "editor.codeActionsOnSave": {
        "source.fixAll.eslint": true
    }
}

Need to customize?

Here is an example of how you could customize for your project :

An example of .eslintrc.js

const eslintAmedia = require('@amedia/eslint-config-base');

delete eslintAmedia.parser;
eslintAmedia.rules['import/extensions'] = 1;
eslintAmedia.parserOptions.ecmaVersion = 2020;

module.exports = eslintAmedia;

Lint script

You might want to add these two scripts in you package.json.

"scripts": {
  "lint": "eslint bin lib",
  "lint-fix": "eslint --fix bin lib"
},