“Code formatting is important. It is too important to ignore and it is important to treat religiously. Code formatting is about communication, and communication is the professional developer’s first order of business.”
— Robert C. Martin. Clean code: A handbook of Agile software craftmanship
Update: I now use ESLint and Prettier to keep a consistent coding style. You can find more information in this article.
ESLint detects errors or problems in your code, as well as JSHint. For instance it raises an error if a variable in not declared. Moreover it also checks the coding style based on rules. It will warm you in case you missed a space after
if for example.
You specify the rules in a configuration file
.eslinrc. It could be globally, saved in your $HOME, or locally at the root of your project. Here is my .eslintrc as an example, and you can find more information about the configuration in the project documentation.
You can use it in different way, either with the command line, or your favourite tasks runner or directly in your text editor. (See the official plugins list.) I prefer to use it in my code editor (in Vim through syntastic), thereby I get direct feedback and it helps me to avoid errors while coding.
So far I really like it, it’s in between JSHint and JSCS (which is only focused on the coding style). The list of rules cover almost everything. So if you like JSHint, I definitively recommend you to give a try to ESLint.
esformatter beautifies your code based on a set of rules. As ESLint, you define the rules in a .esformatter file, which could be global ($HOME) or local (project’s root). I recommend you to try out esformatter-visualize that will help you out to configure your settings.
You can use esformatter through command line interface, tasks runner (Gulp, Grunt and Brunch) and text editor (Vim, Sublime Text and Atom).
Like ESLint, I prefer to use esformatter inside Vim. It lets me code quickly without worrying too much about code formatting and I trigger the command (
<leader>es) to beautify it.
It is still “work in progress” but it does a pretty great job so far. It starts to have more and more plugins to fit specific needs, like using one var or multiple var statement. I look forward to be able to use one configuration file for both ESLint and esformatter as they are almost using the same rules.
If you are interested, here is my .esformatter file.
ES6 & JSX
Feel free to share your experience or tools you like to use to maintain your coding style.