grunt-contrib-jshint使用

使用grunt-contrib-jshint插件

 

jshint：A Static Code Analysis Tool for JavaScript（javascript验证工具）。它有很多种安装方法。http://jshint.com/install/。这篇文章主要介绍作为grunt插件的安装方法。

1、安装jshint

　　安装前提：需要安装node和grunt。http://blog.csdn.net/wangfupeng1988/article/details/46418203

　　①windows平台下：npm install grunt-contrib-jshint --save-dev

　　②其他平台前面加sudo

　　③注：--save-dev是为了在package.json自动构建devDependencies。可手动设置。

2、配置

　　①可在Gruntfile.js中进行配置，

grunt.initConfig({
  jshint: {
    options: {
      curly: true,
      eqeqeq: true,
      eqnull: true,
      browser: true,
      globals: {
        jQuery: true
      },
    },
    uses_defaults: ['dir1/**/*.js', 'dir2/**/*.js'],
    with_overrides: {
      options: {
        curly: false,
        undef: true,
      },
      files: {
        src: ['dir3/**/*.js', 'dir4/**/*.js']
      },
    }
  },
});

 　　②可使用外部jshintrc文件，加下划线的代码表示的是与Gruntfile.js相同目录的jshintrc文件，也可以是其他目录下的jshintrc文件，使用相对目录就行了。

grunt.initConfig({
  jshint: {
    options: {
      jshintrc: '.jshintrc'
    },
    uses_defaults: ['dir1/**/*.js', 'dir2/**/*.js'],
    with_overrides: {
      options: {
        curly: false,
        undef: true,
      },
      files: {
        src: ['dir3/**/*.js', 'dir4/**/*.js']
      },
    }
  },
});

 

　　.jshintrc文件(标准JSON文件)：

{
  "curly": true,
  "eqeqeq": true,
  "eqnull": true,
  "browser": true,
  "globals": {
    "jQuery": true
  }
}

 

3、配置参数解释

　　bitwise：是否禁止使用位运算，因为在javascript使用位运算的时候很少，并且很多时候会把&&错写为&。

　　camelCase：验证变量是否是骆驼式或UPPER_CASE写法；过时的，在后面的jshint中会移除。

　　curly：使用大括号，比如if(true) dosomething();需要使用大括号，if(true) {dosomething();}

　　eqeqeq：强制==(!=)为===(!==)

　　es3：按照ECMAScript 3标准执行，针对IE6/7/8/9

　　es5：按照ECMAScript 5.1标准执行，对于低级的浏览器不适用

　　forin：验证循环的属性是否是对象自己的，而不是继承的。如果没有使用hasOwnproperty会报错

　　freeze：禁止重写本地对象的原型链，如禁止Array.property.someAttr = function(){};

　　funcscope：如果局部作用域使用了外部变量，则提示。

　　futurehostile：提示是否使用了未来可能会出现的标识符

　　globals：设置全局变量白名单

　　iterator：迭代器，所有浏览器都不支持。

　　latedef：This option prohibits the use of a variable before it was defined.

　　maxcomplexity：最大复杂度

　　maxdepth：最大深度

　　maxerr：最大警告数，默认为50

　　maxlen：每一行代码的最大长度；过时的，将被移除

　　maxparams：每个函数的最大参数个数

　　maxstatements：每一个函数最多包含的statement的数目

　　noarg：禁止使用arguments.caller 和 arguments.callee. 

　　nocomma：在一个statement中禁止使用逗号，好无理的要求

　　noempty：禁止空的block，过时的，将被移除

　　nonbsp：禁止空格

　　nonew：禁止使用不赋值的构造函数，例：new NewConstructor();

　　notypeof：在使用typeof的时候，对比的值不存在typeof结果列表中，警告

　　shadow：http://jshint.com/docs/options/#shadow

　　singleGroups：http://jshint.com/docs/options/#singleGroups

　　strict：ECMAScript 5严格模式

　　undef：未声明变量

　　unused：未使用变量

　　varstmt：禁止使用var申明变量

 

　　asi：分号

　　boss：http://jshint.com/docs/options/#boss

　　debug：如果出现debugger statement，则报错

　　elision：uses ES3 array elision elements

　　eqnull：如果代码中使用了==null，则报错，无理的要求。

　　esnext：使用ECMAScript 6语法解析，可惜的是ECMAScript还未定稿，所以这个验证也不标准。并且没有任何浏览器实现ECMAScript 6.

　　evil：当使用eval的时候报错

　　expr：http://jshint.com/docs/options/#expr

　　gloablstrict：当使用全局严格模式时报错

　　lastsemic：允许在块的最后不适用分号

　　loopfunc：http://jshint.com/docs/options/#loopfunc

　　moz：Mozilla JavaScript 扩展

　　plusplus：禁止使用++和--

　　proto：当使用__proto__时报错

　　scripturl：http://jshint.com/docs/options/#scripturl

　　supernew：禁止使用这些操作：new function () { ... } and new Object;.

　　validthis：验证this变量

　　withstmt：禁止使用with操作

　　

　　browser：浏览器环境

　　其他生产环境：http://jshint.com/docs/options/#environments

 

4、常用的参数

　　bitwise、curly、eqeqeq、es3、forin、freeze、funcscrop、futurehostile、globals、latedef、noarg、nonbsp、notypeof、strict、undef、unused

　　asi、eqnull、evil、expr、globalstict、loopfunc、plusplus、validthis、withstmt

　　生产环境：browser、jquery、dojo、node、qunit、prototypejs、yui

5、加载插件，在grunt.initConfig代码之后

　　grunt.loadNpmTasks('grunt-contrib-jshint');

6、注册任务，在加载插件之后

　　grunt.registerTask('core-js', ['jshint:core']);

7、使用，在终端中输入以下代码

　　grunt core-js

8、例子：

　　

 1 // Gruntfile.js文件
 2 module.exports = function( grunt ) {
 3   'use strict';
 4 
 5   grunt.initConfig({
 6 
 7     pkg : grunt.file.readJSON('package.json'),
 8 
 9     jshint : {
10       options : {
11         jshintrc : '.jshintrc'
12       },
13       core : {
14         src : 'src/js/**/*.js'
15       }
16     }
17 
18   });
19 
20   grunt.loadNpmTasks('grunt-contrib-jshint');
21 
22   grunt.registerTask('core-js', ['jshint:core']);
23 
24   grunt.registerTask('default', []);
25 };

 

 1 // .jshintrc文件代码，标准json格式，与Gruntfile.js同一级目录
 2 {
 3   "bitwise": true,
 4   "curly": false,
 5   "eqeqeq": false,
 6   "es3": true,
 7   "freeze": true,
 8   "funcscrop": true,
 9   "futurehostile": true,
10   "latedef": true,
11   "noarg": true,
12   "nonbsp": true,
13   "notypeof": true,
14   "strict": true,
15   "undef": true,
16   "unused": true,
17   "asi": true,
18   "eqnull": true,
19   "evil": true,
20   "globalstrict": true,
21   "loopfunc": true,
22   "plusplus": false,
23   "validthis": true,
24   "withstmt": true,
25   "browser": true,
26   "jquery": true
27 }