What they do:
- ESLint: underline when code doesn’t comply to logical rules. Can run a script and fix some easy errors (etc. unused variables lying around)
- Prettier: doesn’t change the logic of code, only formats it (etc. removing extra spaces, turning double quotes to singles)
Their roles are different but similar, so they do sometimes step on each others’ toes (etc. quotes, trailing commas…).
When they do clash, use:
$ npm --save-dev eslint-config-prettier
Then add preset configuration in .eslintrc
, so that ESLint doesn’t get pissed when an error can be easily auto-fixed by saving the file with Prettier plugin on:
{
"extends": ["prettier"]
}