javascript - Gulp with browserify 静默失败

Question

我有一个使用 Angular.js 的项目，很久以前我为此创建了一些 gulp 任务。我最近买了一台新电脑并试图运行它，但它在我的 browserify 任务中默默地失败了(日志中没有错误)。

gulp.task('imgs', ['html'], function () {
    return gulp.src(paths.img + '*')
        .pipe(gulp.dest(paths.dist_img));
});

gulp.task('browserify', ['imgs'], function () {
    return browserify(paths.src + 'index.js', {debug: true})
        .bundle()
        .pipe(source('index.js'))
        .pipe(gulpPlugins.rename('bundle.js'))
        .pipe(gulp.dest(paths.dist))
        .pipe(gulpPlugins.connect.reload());
});

gulp.task('copy-bootstrap-css', ['browserify'], function () {
    return gulp.src(paths.custom + "bootstrap/css/*.css")
         .pipe(gulp.dest(paths.dist_css));
});

我已经调试了一段时间，当我注释掉 browserify 任务的 rename-pipe 或 dest-pipe 时，我注意到它并没有失败。显然，当我这样做时，应用程序无法正常工作。但我找不到真正的原因。

最终在完全绝望的情况下，我为 browserify 输出创建了一个单独的变量，然后应用了管道:

gulp.task('browserify', ['imgs'], function () {
    var b = browserify(paths.src + 'index.js', {debug: true})
        .bundle();
    b.pipe(source('index.js'))
        .pipe(gulpPlugins.rename('bundle.js'))
        .pipe(gulp.dest(paths.dist))
        .pipe(gulpPlugins.connect.reload())
    return b;
});

奇怪的是“修复”了它。这意味着 gulp 任务至少会完全执行。我猜 browserify 仍然没有正确运行，因为我在 bundle.js 上的浏览​​器中得到了“意外的输入结束”，但这可能也是另一个问题。

当我为 browserify.bundle() 使用单独的变量时，有没有人知道为什么这是“有效的”？知道剩下的问题是否相关吗？

因为这可能与版本有关:我的 package.json 中有以下 gulpPl​​ugins，并且在我的新机器上运行 npm 6.4.1 和节点 11.3.0。

"devDependencies": {
    "browserify": "^13.1.1",
    "chai": "^3.5.0",
    "gulp": "^3.9.1",
    "gulp-angular-templatecache": "^2.0.0",
    "gulp-buffer": "0.0.2",
    "gulp-clean": "^0.3.2",
    "gulp-connect": "^5.0.0",
    "gulp-dest": "^0.2.3",
    "gulp-inject": "^4.2.0",
    "gulp-load-plugins": "^1.4.0",
    "gulp-rename": "^1.4.0",
    "gulp-rev-all": "^0.9.7",
    "gulp-rev-replace": "^0.4.3",
    "gulp-sass": "^3.1.0",
    "gulp-streamify": "^1.0.2",
    "gulp-util": "^3.0.7",
    "http-proxy-middleware": "^0.17.4",
    "mocha": "^3.2.0",
    "vinyl-source-stream": "^1.1.0"
}

编辑:当我手动浏览 index.js 文件时，这没有问题，输出是一个 64k 行的大文件，而我的 gulp 任务中的文件只有 1200 行。

Answer 1

我重组了 browserify-task 并删除了重命名，因为 vinyl-source-stream 中的文件名参数已经在进行重命名，我真的不需要它:

gulp.task('browserify', ['imgs'], function () {
    var b = browserify();
    b.add(paths.src + 'index.js', {debug: true});
    var textStream = b.bundle();
    textStream
        .pipe(source('bundle.js'))
        .pipe(gulp.dest(paths.dist))
        .pipe(gulpPlugins.connect.reload())
    return b;
});

请注意，简单地删除重命名管道并更改源管道的文件名并不能解决问题。由于某种原因，这导致了“没有这样的文件或目录”错误。我想这就是我首先添加重命名管道的原因。