EditorConfig: A simple way to manage consistent coding style

As per Robert Martin, Code should be elegant, efficient, readable like well-written prose . I’m also a strong believer of that. There are two key observations that I often see in code when multiple people work in a team. These are

  1. Everybody has different coding style so they write the code in their own way unless a common coding guideline is followed by team. It’s always advisable to make it part of an automated process.
  2. New members join the team and if they are not properly guided, chances are more to have spaghetti code. It becomes more problematic if the new members are junior developers/interns.

These issues can be solved at certain extent with the help of editorconfig file. In this file, we can define a set of rules (we will discuss few) which can be extremely useful to maintain the code consistency. This file can be made a part of solution so it is available to every team member.

Editor Config has it’s own format and guidelines to define the rules which can be seamlessly used by multiple editors like VS Code, Sublime, Vim, Netbeans, Eclipse, notepad++ and many more.

Follwing are the common set of rules which can be used

  • indent_style
  • indent_size
  • end_of_line
  • charset
  • trim_trailing_whitespace
  • insert_final_newline
  • tab_width

Let’s see an example. I have specified the editorconfig as

Here, I provided the indent style, indent size as tab and tab size. The last item trim_trailing_whitespace is set as true. One more thing, these rules will be applied to csharp (.cs) file but we can more file types as [.{cs,vb,js}] or even [*].

Note: The default values of these settings are available in Visual Studio IDE but once we add the editorconfig is added in project, it overrides the IDE setting. A notification also appears as

Let’s first discuss the first three as they are related. The default value for tab size is 4, but here I made it 3. As indent size is marked as tab, it has the power to resolve the whitespace vs tab issue :). Now when a developer uses whitespace for identation, it will turn to tab. In the below example, we can see, for few lines tab is used and for other spaces.

 

If the code is written with the above settings it will be as

Note – I have used ctrl+r, ctrl+w to see the tabs and spaces in the VS IDE.

Also the last settings helped in removing unnecessary white spaces after at the end of the line.

.NET related code conventions can be divided in three categories as

  1. Language Conventions
  2. Formatting Conventions
  3. Naming Conventions

Language Conventions: As the name suggests, these are related to the C#/VB language like using braces, using var instead of explicit type etc. The format looks as

options_name = false|true : none|suggestion|warning|error

Here we need to provide two values true/false and severity. true means prefer this style and false is opposite. Severity has four options as below

  1. none/silent : This will be used by code generation features only. No indication to user if it is not followed.
  2. suggestion : In case of violation, show a suggestion to user which appears as eclipses under the first two characters.
  3. warning : Shows an warning by underlining the variable with green squiggly.
  4. error: Shows an error by underlining the variable with red squiggly.

Let’s see an example. Here first we will see the editorconfig

Now let’s see the code

Here in first part of the image, we can see the gray squiggly and when we select, it displays a suggestion to change it var as per the editorconfig. Also we see the quick action icon which allows us to change with a preview (depicted in second part of the screen). Similarly, let’s see other options

 

In first part of the image, we can see a green squiggly as we configured to have braces and set is as warning. While second part of the pic, we see red squiggly which denotes an error as we configured to use predefined type. So based on our project needs, we can have a specific config file so we every member in the team follows the same rule.

Formatting Conventions : We have a set of rules which can help us in defining formatting guidelines of our code files. These formatting rules can be defined as

rule_name = false|true 

The rules could be as

Here first rule says system directive should be written first while other suggests not to have single line blocks, instead have it in multiple lines. There are many other rules which can be extremely helpful in maintaining the consistency. You can find all the list here. Similarly, Let’s have quick look on naming conventions.

Naming Conventions : Naming of the variable is also one of the key items while writing the code and .NET supports a list of rules which can be used in the editorconfig file. These rules are fully customizable. Let’s say we want a rule where we want public members as captilazied. It can look as

Here we created a new rule (public_members_must_be_capitalized) and provided the definition for that. For details, refer the documentation here.

Now we can see that this file is extremely useful. It may take some time to create but once done, pretty usefull. We can have files at solution and/or project level. At soultion we need to mention root = true as in the first image.

Editor Config has native support in Visual Studio 2017 but for earlier version of Visual Studio you can install the extension from here.

So hope you have enjoyed the post and would be able to use in your projects.

Cheers,
Brij

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

w

Connecting to %s