javascript - Gulp 输出到多个文件而不是一个大文件？

Question

是否可以将 gulpfile 配置为输出多个文件而不是一个？
我遇到的所有示例都演示了将所有 js 文件缩小并串联成一个大的捆绑 js 文件，index.html 将加载。
当您的应用程序使用许多库变得更大、更复杂时，这个 bundle 很快就会变得臃肿，您会发现一个大的 bundle 文件不适合扩展您的应用程序。
这个串联是必须的吗？或者我们可以简单地将每个文件缩小、丑化和浏览器化为输出文件夹中相应的缩小版本吗？

干杯
微开

Answer 1

你绝对可以配置一个 gulpfile 来输出多个文件而不是一个。例如，我有一个 gulp 任务:

gulp.task('styles', function () {
  gulp.src('dev/less/*.less')
    .pipe(plumber())
    .pipe(less())
    .pipe(prefix())
    .pipe(minifyCSS())
    .pipe(gulp.dest('dist/css'))
});

我的 less 文件夹中有 5 个 .less 文件，它们在我的分发文件夹中变成了 5 个名称匹配的 .css 文件。

对于 JavaScript 文件也是如此:

gulp.task('scripts', function () {
  gulp.src('dev/landing/*.js')
    .pipe(uglify())
    .pipe(gulp.dest('dist/js'));
});

在我的 distribution/js 文件夹中，四个 JavaScript 文件变成了丑陋的版本。

但是，如果您想专门解决 browserify 问题，则这是一个不同的问题。 browserify 构建的目的是包含源自最初包含的 JavaScript 文件的任何依赖项。

如果保留单独的文件对您来说更重要，您可以查看 browserify-deoptimizer