Wednesday, May 27, 2015


What is JSHint?
  • Static Code Analysis Tool - means analysis is done without actually executing the Source Code.
  • Flexible and facilitates the customizability of Coding rules.
What JSHint does?
  • Validates the Javascript code to check if it complies with the predefined coding rules.
  • Ensures Code quality and improves maintainability.
Architecture of JSHint
  • JSHint rests on top of JSLint (Lint Project initially set up Crockford)

Setting up JSHint
  • JSHint is distributed as a node module and thus it requires Node.js and NPM to be installed in the System.
  • Install jshint globally with the below command which would help us to trigger JSHint directly via cmd.
           > npm install -g jshint 

  •  Now that we have installed jshint , we can run the analysis against any Javascript file like one such below.
           >jshint testFile.js

.jshintrc - Configuration file

  • .jshintrc is the configuration file where we define the rules that our Source Code should comply with.
      Generation of of .jshintrc
               * We use yeoman to generate this file as JSHint command line tool doesn't facilitate this generation.
              Yeoman is a Scaffolding Tool. It's ok if we are not familiar with yeoman at this moment, we gonna just execute the couple of commands below with it for .jshintrc file generation.

                npm install -g yo  [Installs yeoman]

                npm install -g generator-jshint  [Installs jshintrc generator - one of Yeoman Generator]

                yo jshint [Generates .jshintrc file]

[Refer for the default values for the Applicable rules]

Static Code Analysis .jshintrc File

  • Execute the command jshint .jshintrc js/app.js to run the analysis for the app.js file within the directory named js. 

  • In the command jshint and .jshintrc corresponds to the jshint installed globally  and  .jshintrc - configuration file generated earlier using yeoman.