node.js - 将 gulp-watch 与 babel.js 结合使用

标签 node.js gulp gulp-watch babeljs

下面是一个 Gulp ES6 转译任务。它工作正常,但我正在尝试用 gulp-watch 插件替换 gulp.watch,以便捕获新文件。问题是 gulp-watch 没有给我 gulp.watch 在回调中所做的事情,我不知道该怎么办。

这是我原来的工作任务:

var gulp = require('gulp'),
    rename = require('gulp-rename'),
    plumber = require('gulp-plumber'),
    gprint = require('gulp-print'),
    notify = require('gulp-notify'),
    babel = require('gulp-babel');

gulp.task('default', function() {
    return gulp.watch('../**/**-es6.js', function(obj){
        if (obj.type === 'changed') {
            gulp.src(obj.path, { base: './' })
                .pipe(plumber({
                    errorHandler: function (error) { /* elided */ }
                }))
                .pipe(babel())
                .pipe(rename(function (path) {
                    path.basename = path.basename.replace(/-es6$/, '');
                }))
                .pipe(gulp.dest(''))
                .pipe(gprint(function(filePath){ return "File processed: " + filePath; }));
        }
    });
});

这是迄今为止我对 gulp-watch 的了解:

var gulp = require('gulp'),
    rename = require('gulp-rename'),
    plumber = require('gulp-plumber'),
    gprint = require('gulp-print'),
    notify = require('gulp-notify'),
    babel = require('gulp-babel'),
    gWatch = require('gulp-watch');

gulp.task('default', function() {
    return gWatch('../**/**-es6.js', function(obj){
        console.log('watch event - ', Object.keys(obj).join(','));
        console.log('watch event - ', obj.event);
        console.log('watch event - ', obj.base);

        return;
        if (obj.type === 'changed') {
            gulp.src(obj.path, { base: './' })
                .pipe(plumber({
                    errorHandler: function (error) { /* elided */ }
                }))
                .pipe(babel())
                .pipe(rename(function (path) {
                    path.basename = path.basename.replace(/-es6$/, '');
                }))
                .pipe(gulp.dest(''))
                .pipe(gprint(function(filePath){ return "File processed: " + filePath; }));
        }
    });
});

日志的输出是这样的:

watch event - history,cwd,base,stat,_contents,event

watch event - change

watch event - ..

如何让 gulp-watch 为我提供之前的信息,或者如何更改我的任务代码以使其再次与 gulp-watch 一起工作?

最佳答案

根据tests , obj.relative 应该包含相对文件名,并且 obj.path 仍将保留绝对文件路径,就像在原始代码中一样。此外,回调接受 Vinyl 对象,记录如下: https://github.com/wearefractal/vinyl

您可能无法在日志中看到它们,因为 Object.keys 不会枚举原型(prototype)链中的属性。

使用 for..in 循环,您应该能够看到所有属性。

关于node.js - 将 gulp-watch 与 babel.js 结合使用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/29493057/

相关文章:

node.js - Waterline-OrientDB - 双向边缘

node.js - 尝试使用 gulp 构建一个简单的项目时出现此错误

ionic-framework - Gulpfile 未找到 : ./gulpfile.js - 即使它存在于 Ionic 1 中

gulp - 每次我运行 gulp 任何东西时,我都会收到断言错误。 - 必须指定任务功能

node.js - 如何在 Ubuntu 12.04 中安装 cordova?

node.js - 提前结束 http 请求

laravel - Elixir 和 Gulp - 复制和连接

node.js - 在 Docker VM 中,Gulp-Watch 似乎不适用于从主机操作系统托管的卷

javascript - 为什么浏览器与 gulp 同步不起作用

node.js - 使用 node-rdkafka 重新连接到 Kafka 缓慢且不一致