2015年9月11日星期五

调试gulp

1。要安装gulp-intercept
npm install gulp-intercept --save-dev

2。执行node-inspector
C:\Users\Jacky>node-inspector
Node Inspector v0.12.3
Visit http://127.0.0.1:8080/?ws=127.0.0.1:8080&port=5858 to start debugging.

3。windows上调试gulp,需要到应用的目录下
node-debug "C:\Users\Jacky\AppData\Roaming\npm\node_modules\gulp\bin\gulp.js" styles,这个会发现node-inspector,然后连接上node-inspector后启动chrome
 unix上面 执行node-debug $(which gulp) styles

4。在chrome里面单步就可以了。

虽然这样可以调试gulp了,但是gulp的那一堆的pipe却是不行的,要想查看pipe里面的内容,需要用到gulp-print,gulp-debug,或者gulp-intercept,
gulp-print只能打印出filename
gulp-debug可以打印出filename以外的内容,但是仍然打印不出文件的内容自身
gulp-intercept才是最强,可以打印出所有的内容。

测试代码如下


    .pipe(wiredep(_.extend({}, conf.wiredep)))
    //.pipe($.print())      //only can print filename
    /*.pipe($.print(function(filepath) { //custom print filename
      return "built: " + filepath;
      })
    )
    .pipe($.intercept(function(file){
      //https://www.npmjs.com/package/vinyl
      //console.log('file: ' + JSON.stringify(file));
      console.log('file.cwd: ' + file.cwd );
      console.log('file.base ' + file.base );
      console.log('file.path: ' + file.path );
      console.log('file.history: ' + file.history );
      console.log('file.relative : ' + file.relative);
      console.log('file.dirname : ' + file.dirname);
      console.log('file.basename : ' + file.basename);
      console.log('file.extname : ' + file.extname);
      //https://nodejs.org/api/fs.html#fs_class_fs_stats
      console.log('file.stat: ' + JSON.stringify(file.stat));
      //console.log('file.contents.type: ' + file._contents.type);
      //console.log('file.contents: ' + file.contents.toString() );
      return file;})
    )*/
    //.pipe($.debug({title: 'zyz debug:', minimal: false}))

没有评论:

发表评论