JSHint behave differently in Webstorm and Grunt

All we need is an easy explanation of the problem, so here it is.

I have created a new service with Grunt using the angular-generator and then reformatted the code with WebStorm Ctrl+ALT+L as the tabs / spaces seem to be different.

Then when using Grunt and the task JShint complains I get the following errors:

app/scripts/services/poteservice.js
  line 11  col 13  Expected '}' to have an indentation at 15 instead at 13.
  line 14  col 13  Expected '}' to have an indentation at 15 instead at 13.

Another strange issue is that I found that I can enabled JSHint inside WebStorm but then I get issues like

 JSHINT: angular not defined

    and

 Use the function form of use strict

Anybody knows how to make everyone play together nicely i.e. WebStorm and Grunt etc.

I do have the WebStorm plugin for angular installed.

Can anyone help?

How to solve :

I know you bored from this bug, So we are here to help you! Take a deep breath and look at the explanation of your problem. We have many solutions to this problem, But we recommend you to use the first method because it is tested & true method that will 100% work for you.

Method 1

First, you should configure WebStorm to use the same JSHint file as Grunt.

Go to Project Settings -> Javascript -> Code Quality Tools -> JSHint click Enable and reference to the .jshintrc in your Project.

Second, you should add this two lines of code at the top of all your JavaScript files:

/* global angular */
'use strict';

Note: Use and implement method 1 because this method fully tested our system.
Thank you 🙂

All methods was sourced from stackoverflow.com or stackexchange.com, is licensed under cc by-sa 2.5, cc by-sa 3.0 and cc by-sa 4.0

Leave a Reply