转换成ES 5使用babel通过吞咽手表不工作

Question

我刚开始吞咽。我正在尝试设置一个手表，以便将我的src/main.js文件转换为dist/main.js文件。Gulpfile有以下代码

var gulp = require('gulp');
var babel = require('gulp-babel');
var watch = require('gulp-watch');
var paths = {
    babel:"src/main.js"
}
gulp.task('babel', function() {
    return gulp.src(paths.babel)
        .pipe(watch(paths.babel))
        .pipe(babel())
        .pipe(gulp.dest('dist/'))
})
gulp.task('default', ['babel']);

我的dist/main.js文件没有反映src/main.js的更改。如有任何关于我哪里出错的帮助，我们将不胜感激。

Answer 1

尝试以下操作（并确保执行gulp watch，而不仅仅是gulp）：

var gulp = require('gulp');
var babel = require('gulp-babel');
var watch = require('gulp-watch');
var rimraf = require('rimraf');
var paths = {
  babel: 'src/main.js',
  build: 'dist'
};
gulp.task('clean', function(cb) {
  rimraf(paths.build, cb);
});
gulp.task('build', ['clean'], function() {
  return gulp
    .src(paths.babel)
    .pipe(babel())
    .pipe(gulp.dest(paths.build));
});
gulp.task('watch', ['build'], function() {
  return watch(paths.babel, function() {
    gulp.start('build');
  });
});
gulp.task('default', ['build']);

如果这不起作用，也许你的paths.babel错了。尝试将其更改为src/**/*.js。

Answer 2

babel任务和watch任务是分开的：

var gulp = require('gulp');
var babel = require('gulp-babel');
var watch = require('gulp-watch');
var paths = {
    babel:"src/main.js"
};
gulp.task('watch', function() {
    gulp.watch(paths.babel, ['babel']);
});
gulp.task('babel', function() {
   gulp.src(paths.babel)
        .pipe(babel())
        .pipe(gulp.dest('dist/'));
});
gulp.task('default', ['watch']);

watch在检测到"src/main.js" 发生更改时将执行babel