@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
Install
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-base3.5.1-alpha.0" peerDependencies
npm install --save-dev @amedia/eslint-config-base3.5.1-alpha.0
yarn
yarn add @amedia/eslint-config-base3.5.1-alpha.0 -D
Install the correct versions of each peerDependency package, which are
listed by the command:
npm info "@amedia/eslint-config-base3.5.1-alpha.0" 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"
},