gulp-jshint使用說明

標籤：代碼   oba   image   repo   for   asc   com   author   maps   

hint是暗示的意思，jshint是什麼意思？

1.使用npm安裝

cnpm i --save-dev gulp-jshint jshint

　　ps：gulp-jshint和jshnt要一起下載，安裝。

2. 設定檔

有兩種方法：

a> 建立.sjhint檔案，參考配置如下 ：

 

{  "undef": true,  // 所有的非全域變數，在使用前必須都被聲明  "unused": true, // 所有的變數必須都被使用  "predef": [ "MY_GLOBAL" ]  // 這裡的變數可以不用檢測是否已經提前聲明}

 

b> 在package.json 添加jshintConfig選項

{  "jshintConfig":{    "undef": true,    "unused": true,    "predef": [ "MY_GLOBAL", "ads" ] // 聲明幾個全域變數  },  "author": "wenzi",  "license": "ISC"}

　　參數配置說明（傳送門）

 

3.gulpfile.js 設定檔：

var gulp = require(‘gulp‘);var jshint = require(‘gulp-jshint‘);// 建立js任務，進行代碼檢查gulp.task(‘js‘, function(){gulp.src(‘./js/**/*.js‘)  // 檢查檔案：js目錄下所有的js檔案
　　　　　//.pipe(jshint(jshintConfig)) //根據jshintConfig的規則而檢測        .pipe(jshint())       // 進行檢查        .pipe(jshint.reporter(‘default‘))  // 對代碼進行報錯提示});gulp.task(‘default‘, [‘js‘])

　　

自訂錯誤（引入map-stream模組）提示：

var mapstream = require( ‘map-stream‘ );/* file.jshint.success = true; // or false 代碼檢查是否成功 file.jshint.errorCount = 0; // 錯誤的數量file.jshint.results = []; // 錯誤的結果集file.jshint.data = []; // JSHint returns details about implied globals, cyclomatic complexity, etc file.jshint.opt = {}; // The options you passed to JSHint */var myReporter = map(function (file, cb) {    if (!file.jshint.success) {        console.log(‘[ ‘+file.jshint.errorCount+‘ errors in ]‘+file.path);        file.jshint.results.forEach(function (err) {            /*                err.line 錯誤所在的行號                err.col  錯誤所在的列號                err.message/err.reason 錯誤資訊            */            if (err) {                console.log(‘ ‘+file.path + ‘: line ‘ + err.line + ‘, col ‘ + err.character + ‘, code ‘ + err.code + ‘, ‘ + err.reason);            }        });    }    cb(null, file);});gulp.task(‘jshint‘, function() {  return gulp.src(‘./lib/*.js‘)  // lib目錄下所有的js檔案    .pipe(jshint())     // js代碼檢查    .pipe(myReporter);  // 若有錯誤，則調用myReporter進行提示});

　　

 

 

 

　　

 

gulp-jshint使用說明