@evermind/eslint-config-base
Version:
Base eslint rules that we use at Evermind Digital
95 lines (86 loc) • 3.66 kB
Markdown
# js
* This is the base set of eslint rules (and, consequently, style) for JavaScript at Evermind.
* Inspired by the many great style-guides out there, but particularly [Zeit's](https://github.com/zeit/eslint-config-base) and [Airbnb's](https://github.com/airbnb/javascript).
## Principles (in priority order)
* Safe
* Readible
* Consistent
* Clean
* Brief
* Easy
## Uses
* [`eslint`](https://github.com/eslint/eslint) -> For syntax and code issues, as well as some stylistic linting
* [`husky`](https://github.com/typicode/husky) -> Manage githooks
* [`lint-staged`](https://github.com/okonet/lint-staged) -> Use with husky for automatic linting on git commit
## Notes
* This is a work in progress and should be thought of as organic, rather than static. It is as much a tool to decide what the style should be as it is an enforcement and declaration of that style.
* If something should never be in your code, it is an error, regardless of the severity of the issue.
* If something probably shouldn't be in your code, but might just require extra oversight from the programmer, the rule should produce a warning. The programmer should then insert a comment to remove the error, or adjust the code accordingly. See the [eslint docs](https://eslint.org/docs/user-guide/configuring#using-configuration-comments) for details.
* You should add rules here where possible, not in individual projects.
## Usage
* Make sure you have eslint installed and initialised: `npm --save-dev i eslint`/`yarn add --dev eslint`
* Install with yarn (or npm)
```
yarn add --dev @evermind/eslint-config-base
```
* You should extend this in your `eslintrc.js`.
```javascript
{
'extends': '@evermind/eslint-config-base'
}
```
* See https://eslint.org/docs/developer-guide/shareable-configs for details.
* Add the following to your package.json scripts (adjusting for the appropriate src folder accordingly):
```javascript
"husky": {
"hooks": {
"pre-commit": "lint-staged"
}
},
"lint-staged": {
// note that lint-staged chooses the path for linting for you
"*.{js,jsx}": [
"yarn lint",
"git add"
]
},
"scripts": {
"lint": "eslint ./src",
}
```
* Setup your editor as necesary: https://marketplace.visualstudio.com/items?itemName=dbaeumer.vscode-eslint, https://github.com/w0rp/ale
### Git Hooks
* This packagage assumes you are using githooks to run linting (hence the fact that `husky` and `elint-staged` are dependencies, although they do not technically need to be implemented).
* If you add to your package.json as specified above, you'll have automatic linting taken care of for you on each commit, for the files you are commiting only.
### Flow
* If you have flow installed, you will also need to run `yarn add --dev eslint-plugin-flowtype`.
* You will then need to add the following to your `.eslintrc.js`:
```javascript
{
'extends': [
'plugin:flowtype/recommended',
],
'plugins': [
'flowtype',
],
}
```
* You may also want to add some githooks for extra flow checking by adding `flow --write` to lint-staged in your `package.json`.
### React
* If you are using react, you will also need to run `yarn add --dev eslint-plugin-react`
* Then add the following to your `.eslnitrc.js`:
```javascript
{
'extends': [
'plugin:react/recommended',
],
'plugins': [
'react',
],
}
```
## Updating
1. Make appropriate changes in repo
- Ensure stylistic changes (i.e. overwrites of Prettier) go in `styleRules.js`.
2. `npm version <update_type>` (where update type is one of `patch`, `minor`, or `major`)
3. `npm publish`