ESLint and prettier
As a developer and VIM enthusiast I heavily rely on tools to fix my code. I just want to write, and let the program worry about making it adhere to code standards.
Furthermore, I would like to see linting errors.
There are some well-known tools for JavaScript, for example ESLint. ESLint is an open-source project by Nicholas C. Zakas which analyzes your code and looks for problematic patterns.
Prettier is a code formatter, also available for JavaScript. It removes all styling and formats it to a consistent style.
In the past, I’ve used ESLint, Prettier and ALE (a VIM plugin) to help me writing JavaScript.
The setup is quite easy, if you know what you have to do. But for some frameworks, like Svelte.js, it get’s more complicated. You have to tweak the configuration to make it work. Plus, you have to make sure it also works with ALE.
Additionally, ESLint sometimes throws parsing errors which you have to debug.
For plain old JavaScript or React.js, I’ve found a simpler solution.
prettier-standard
Enter prettier-standard.
prettier and standard brought together
While standard is a linter, prettier-standard is a formatter. You don’t have to fix any warnings anymore
This tool combines the linter standard.js with the code formatter prettier.
Installation
Check out the github repository for instructions.
It’s as easy as installing an NPM package:
yarn add --dev prettier-standard
ALE also supports prettier-standard:
Plug 'w0rp/ale'
let g:ale_fixers = {'javascript': ['prettier_standard']}
let g:ale_linters = {'javascript': ['']}
let g:ale_fix_on_save = 1
Conclusion
If you are ok with standard’s decisions on code style, and would like to bolt on code formatting with prettier, you should give prettier-standard a try.
The setup is less hassle and results in fewer parsing errors.