gulp-jshint使用说明
hint是暗示的意思,jshint是什么意思?
1.使用npm安装
cnpm i --save-dev gulp-jshint jshint
ps:gulp-jshint和jshnt要一起下载,安装。
2. 配置文件
有两种方法:
a> 新建.jshint文件,参考配置如下 :
{
"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使用说明的更多相关文章
- JSHint 使用说明
SHint介绍 翻译自www.jshint.comJSHint(注意不是jslint:))是一个由javascript社区驱动开发的用于检查javascript代码错误和问题的工具,有了他,可以使你保 ...
- Gulp Error: Cannot find module 'jshint/src/cli'
I'm following sitepoint's An introduction to Gulp.js, but I'm stuck on step four, when I try to run ...
- 前端构建大法 Gulp 系列 (四):gulp实战
前端构建大法 Gulp 系列 (一):为什么需要前端构建 前端构建大法 Gulp 系列 (二):为什么选择gulp 前端构建大法 Gulp 系列 (三):gulp的4个API 让你成为gulp专家 前 ...
- Gulp探究折腾之路(I)
前言: gulp是前端开发过程中对代码进行构建的工具,是自动化项目的构建利器:她不仅能对网站资源进行优化,而且在开发过程中很多重复的任务能够使用正确的工具自动完成:使用她,我们不仅可以很愉快的编写代码 ...
- (转)gulp使用
前端构建工具gulpjs的使用介绍及技巧 gulpjs是一个前端构建工具,与gruntjs相比,gulpjs无需写一大堆繁杂的配置参数,API也非常简单,学习起来很容易,而且gulpjs使用的是nod ...
- gulp实现打包js/css/img/html文件,并对js/css/img文件加上版本号
参考打包教程: http://www.cnblogs.com/tugenhua0707/p/4069769.html http://www.cnblogs.com/tugenhua0707/p/498 ...
- 前端构建工具gulp介绍
2016年3月3日 10:46:08 晴 前端构建工具gulpjs的使用介绍及技巧 gulpjs是一个前端构建工具,与gruntjs相比,gulpjs无需写一大堆繁杂的配置参数,API也非常简 ...
- gulp常用插件
本人就职于一家互联网小公司,根据自己的项目纪录一下常用的gulp插件,项目不是很大! 文章目录 1. gulp-load-plugins 2. yargs 3. del 4. gulp-filter ...
- Gulp探究折腾之路(I)2
文/晚晴幽草(简书作者)原文链接:http://www.jianshu.com/p/9768a4dc7cf7著作权归作者所有,转载请联系作者获得授权,并标注“简书作者”. 前言: gulp是前端开发过 ...
- gulp学习笔记3
gulp系列学习笔记: 1.gulp学习笔记1 2.gulp学习笔记2 3.gulp学习笔记3 4.gulp学习笔记4 1.编译sass Sass 是一种 CSS 的开发工具,提供了许多便利的写法,大 ...
随机推荐
- Nginx 访问日志
配置访问日志: [root@localhost ~]$ cat /usr/local/nginx/conf/nginx.conf http { log_format main '$remote_add ...
- 【重要】U3D存放本地游戏存档——不同平台载入XML文件的方法——IOS MAC Android
在PC上和IOS上读取XML文件的方式略有差别,经测试,IOS上不支持如下方法载入XML文件: XmlDocument xmlDoc = new XmlDocument(); xmlDoc.Load( ...
- codeforces水题100道 第二十一题 Codeforces Beta Round #65 (Div. 2) A. Way Too Long Words (strings)
题目链接:http://www.codeforces.com/problemset/problem/71/A题意:将长字符串改成简写格式.C++代码: #include <string> ...
- JSON调试找不到 net.sf.ezmorph.Morpher
JSON中,java.lang.NoClassDefFoundError: net/sf/ezmorph/Morpher问题解决 使用JSON,在SERVLET或者STRUTS的ACTION中取得数据 ...
- 《转载》Python并发编程之线程池/进程池--concurrent.futures模块
本文转载自Python并发编程之线程池/进程池--concurrent.futures模块 一.关于concurrent.futures模块 Python标准库为我们提供了threading和mult ...
- Android 之 布局训练
1.线性布局 LinearLayout <?xml version="1.0" encoding="utf-8"?> <LinearLay ...
- 【EF框架】使用params参数传值防止SQL注入报错处理
通过SqlParameter传时间参数,代码如下: var param = new List<SqlParameter>(); param.Add(new SqlParameter(&qu ...
- openlayers中利用vector实现marker的方式
项目需要一个小型的gis.openlayers,geoserver,postgres组合是比较好的选择. openlayers的marker层好像不支持拖动操作.通过研究api发现,可以利用vecto ...
- sass - 公用方法封装
// 设置宽高 @mixin wh($wid,$hei){ @if $wid { width: $wid; } @if $hei { height: $hei; } overflow: hidden; ...
- nginx+memcache实现页面缓存应用
一.前言 nginx的memcached_module模块可以直接从memcached服务器中读取内容后输出,后续的请求不再经过应用程序处理,如php-fpm.django,大大的提升动态页面的速度. ...