Popular:
 Building Resilient Systems on AWS: Learn how to design and implement a resilient, highly available, fault-tolerant infrastructure on AWS.

Per-Project Whitespace with EditorConfig

By  on  

Standards can change from project to project.  Single quotes or double quotes?  MooTools, Dojo, or micro-frameworks?  And then the question that has started wars:  spaces or tabs?  I'm a tab guy myself but the team that I work on has set a two-space standard.  It's not my preference but it was a team decision so I have to drink the Kool-Aid.  I still want to use my typical tab whitespace on other projects but just this one project should use spaces.  I thought this would be a nightmare but enter EditorConfig, a utility with plugins for several text editors which allows developers to specify settings per project.

Start by creating a .editorconfig and placing it at the root of the project which you'd like to create whitespace for:

touch .editorconfig

Once the file is in place, it's up to you to set the spacing settings per file type as you wish:

# EditorConfig is awesome: http://EditorConfig.org

# top-most EditorConfig file
root = true

# Unix-style newlines with a newline ending every file
[*]
end_of_line = lf
insert_final_newline = true

# 4 space indentation
[*.py]
indent_style = space
indent_size = 4

# Tab indentation (no size specified)
[*.js]
indent_style = tab

# Indentation override for all JS under lib directory
[lib/**.js]
indent_style = space
indent_size = 2

So not only can you set spacing per project but you can set them per file too.  I've found EditorConfig to be a lifesaver as I can code per usual without having to think about spaces or tabs.  EditorConfig made my day!

Request Metrics real user monitoring
Request Metrics real user monitoring
Request Metrics real user monitoring
Request Metrics real user monitoring

Recent Features

  • By
    Vibration API

    Many of the new APIs provided to us by browser vendors are more targeted toward the mobile user than the desktop user.  One of those simple APIs the Vibration API.  The Vibration API allows developers to direct the device, using JavaScript, to vibrate in...

  • By
    How to Create a Twitter Card

    One of my favorite social APIs was the Open Graph API adopted by Facebook.  Adding just a few META tags to each page allowed links to my article to be styled and presented the way I wanted them to, giving me a bit of control...

Incredible Demos

  • By
    pointer Media Query

    As more devices emerge and differences in device interaction are implemented, the more important good CSS code will become.  In order to write good CSS, we need some indicator about device capabilities.  We've used CSS media queries thus far, with checks for max-width and pixel ratios.

  • By
    Telephone Link Protocol

    We've always been able to create links with protocols other than the usual HTTP, like mailto, skype, irc ,and more;  they're an excellent convenience to visitors.  With mobile phone browsers having become infinitely more usable, we can now extend that convenience to phone numbers: The tel...

Discussion

  1. MaxArt

    In Notepad++ you can change the indent behaviour clicking on Preferences / Tab Settings and defining the tab width and characters as a general behaviour or on a per language basis.

    • RC

      Yeah, nearly every editor and IDE worth its salt can do this.

      But you’re missing the point. EditorConfig is most useful in a COLLABORATIVE development project, where you have a multitude of devs and a multitude of IDEs/editors. EditorConfig attempts to establish a common standard for IDE/editors to enforce whitespace rules.

  2. Pete

    I recently started a repo of my editorconfig, lint config, and sublime text user preferences, this way I always have them and can keep several machines in sync.

    https://github.com/PeteSchuster/dot-config-files

Wrap your code in <pre class="{language}"></pre> tags, link to a GitHub gist, JSFiddle fiddle, or CodePen pen to embed!