使用 gulp 和 main-bower-files 对输出进行排序（gulp-order 不起作用）

Question

这里是 Java 工程师，是 Javascript 世界的新手，如果我没有提供足够/正确的信息，敬请见谅！

我有一个 gulp 构建脚本并使用 bower 来管理我的 JS 前端应用程序的依赖项。我正在努力让（bower 控制的）供应商 javascript 库以正确的顺序连接起来，以便 jQuery 和 angular 排在第一位。

如果它们不是第一个，那么当我加载我的应用程序时，我会得到 angular is undefined 或 jQuery is undefined，因为它们对应的 javascript 代码被埋在下面的某个地方级联库。

我尝试使用gulp-order 对生成的main-bower-files 调用的输出进行排序，但似乎没有效果。

我的 gulp 任务如下：

gulp.task('lib', function () {
    var files =
      gulp.src(mainBowerFiles({
        paths: {
          bowerrc: './.bowerrc',
          bowerJson: './bower.json'
        }, env: 'lib'}))
      .pipe(order(["vendor/bower/jquery/**/*.js", "vendor/bower/angular/**/*.js", "vendor/bower/**/*.js" ]))

  return processJsFiles('lib', files);
});

processJsFiles 完成 uglify 工作，看起来很像：

        .pipe(uglify(name + '.js', {
            outSourceMap: true,
            screwIe8: true,
            compress: {
              hoist_funs: false,
              if_return: false
            }
        }))
        .pipe(gulp.dest(build_dir))
        .pipe(gzip())
        .pipe(gulp.dest(build_dir));

我应该这样做的任何线索或更好的方法？

Answer 1

在仔细阅读文档后，我发现您需要指定订单插件需要从哪里开始，例如：

gulp.task('lib', function () {
    var files =
      gulp.src(mainBowerFiles({
        paths: {
          bowerrc: './.bowerrc',
          bowerJson: './bower.json'
        }, env: 'lib'}))
      .pipe(order([
          "vendor/bower/jquery/**/*.js", 
          "vendor/bower/angular/**/*.js", 
          "vendor/bower/**/*.js" 
          ], { base: './' })
      );

  return processJsFiles('lib', files);
});