Fei

配置JSHint

2015-05-15

优雅、清晰的代码不是一蹴而就，往往需要借助趁手的工具不断投入心血打磨。

为什么选择 JSHint 而非 JSLint，参考此文JSHint 与 JSLint 的区别与选择。

具体配置 Tuts+ Code 的视频讲的很好，链接在此Setting Up JSHint。

在 Sublime Text 3 中配置 JSHint：

// 安装JSHint
npm i -g jshint

// 添加至PATH
// 如遇问题，参考文档http://sublimelinter.readthedocs.org/en/latest/troubleshooting.html#debugging-path-problems

// 在Sublime Text 3中使用Package Control安装下列插件
SublimeLinter
SublimeLinter-jshint

// 在Sublime Text 3菜单栏中选择
Tools => SublimeLinter => Lint Mode => Background

在 GulpJS 中配置 JSHint:

// 使用插件gulp-jshint
// 来自yeoman/generator-gulp-webapp的配置
// 其中变量$指向gulp-load-plugins
gulp.task('jshint', function() {
  return gulp
    .src('app/scripts/**/*.js')
    .pipe(reload({ stream: true, once: true }))
    .pipe($.jshint())
    .pipe($.jshint.reporter('jshint-stylish'))
    .pipe($.if(!browserSync.active, $.jshint.reporter('fail')))
})

JSHint 配置文件：

// 来自yeoman/generator-gulp-webapp的配置
{
  "browser": true,
  "node": true,
  "esnext": true,
  "bitwise": true,
  "camelcase": true,
  "curly": true,
  "eqeqeq": true,
  "immed": true,
  "indent": 2,
  "latedef": true,
  "newcap": true,
  "noarg": true,
  "quotmark": "single",
  "undef": true,
  "unused": true,
  "strict": true,
  "jquery": true
}