Javascript – How to Get Started with JSCS

This article represents tips on how to get started with JSCS, a Javascript code styler checker tool. The tool comes very handy if you would want to ensure the consistent code formatting across the team.
Please feel free to comment/suggest if I missed to mention one or more important points. Also, sorry for the typos.

• Install/Setup JSCS
• Run JSCS & Code Samples

Install/Setup JSCS

One could install jscs using command such as “npm install -g jscs”. You could also setup Javascript development environment using Dockers as detailed in this page. Once installed, all that is required to be done is following:

• Write formatting rules based on rules found on following page.
• Save the rules in a file such as .jscsrc
• Configure Gruntfile to run jscs check on every build.

Run JSCS & Code Samples

Following is a sample file, hello.js, created with a space after parenthesis:

console.log( "Hello World" );

Following is written in .jscsrc file:

{
    "disallowSpacesInsideParentheses": true
}

Save both the files, hello.js and .jscsrc in the same folder. Following command could be used to execute the JSCS tool. In real world scenario, you could use Grunt to run jscs. The command below assumes that you have saved the formatting rules in a file saved as .jscsrc.

jscs -c .jscsrc ./

Once executed, following error will show up as there are spaced within parenthesis.

Illegal space after opening round bracket at ./hello.js :
     1 |console.log( "Hello World" );
--------------------^
     2 |

Illegal space before closing round bracket at ./hello.js :
     1 |console.log( "Hello World" );
----------------------------------^
     2 |


2 code style errors found.