【问题标题】:Gulp babel completes but code is not updatedGulp babel 完成但代码没有更新
【发布时间】:2015-10-30 06:50:23
【问题描述】:

只要我点击保存,gulp babel 就会完成任务并在终端中打印消息。但是代码没有在浏览器中更新。我有一个本地 Nginx 为我吞咽的文件提供服务。我必须多次重新加载才能获得更新的代码。

我的 gulp 文件:

gulp.task('js', function () {
    gulp.src([
        'src/app.js',
        'src/app.controller.js',
        'src/**/*.js',
        'libs/*.js'
    ])
        .pipe(sourcemaps.init())
        .pipe(babel())
        .pipe(concat()('app.js'))
        .pipe(sourcemaps.write('.'))
        .pipe(gulp.dest('dist'));
});

//other tasks here (css, assets etc)
...

gulp.task('watch', function () {
    gulp.watch('src/**/*.js', ['js']);
    gulp.watch([
        'src/**/*.html',
        'src/images/**/*',
        'src/fonts/**/*',
        'src/**/*.json'], ['assets']);
    gulp.watch('src/**/*.scss', ['sass']);
});
gulp.task('default', ['js', 'sass', 'assets', 'watch']);

Gulp 默认是我运行的。

但是,没有 gulp-babel(对于 ES5)它可以正常工作。我只需在浏览器中重新加载一次即可获得更新的代码。我已经尝试过努力刷新,甚至在 Chrome 中启用了“在打开 devtools 时禁用缓存”选项,但没有运气。

这可能是什么原因?

【问题讨论】:

  • 不确定这是否有帮助,但您应该在js 任务中的gulp.src 之前添加return
  • check out this ,可能是因为缺少预设.pipe(babel({ presets: ['babel-preset-es2015'] }))
  • @Vinodhan babel-preset-es2015 是做什么的?找不到说明
  • @ArjunU。认为由于缺少定义不能按预期工作的 babel([options]) 。我以presets: [] 为例。 check this options list :(
  • @Shvelo Gulp 没有立即完成。这需要时间。添加return 解决了我的问题,因为我有多个流,现在在任务完成后打印消息。你能把它写成答案让我接受吗?

标签: javascript gulp babeljs gulp-watch gulp-concat


【解决方案1】:

你需要在gulp.src之前添加return,这样Gulp才能知道任务何时完成

gulp.task('js', function () {
    return gulp.src([
        'src/app.js',
        'src/app.controller.js',
        'src/**/*.js',
        'libs/*.js'
    ])
        .pipe(sourcemaps.init())
        .pipe(babel())
        .pipe(concat()('app.js'))
        .pipe(sourcemaps.write('.'))
        .pipe(gulp.dest('dist'));
});

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2021-08-31
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多