为什么Gulp以错误的顺序连接我的输出?

为什么Gulp以错误的顺序连接我的输出?,gulp,gulp-uglify,gulp-concat,Gulp,Gulp Uglify,Gulp Concat,如下面的gulpfile.js所示,我正在尝试将jQuery、bootstrap.js和子文件夹中的Javascript片段集合编译成单个app.js输出文件。它正在工作,只是子文件夹中的代码片段在加载jQuery之前出现在app.js输出文件的顶部 如何确保这些文件以正确的顺序输出 const { src, dest, watch, series, parallel } = require('gulp'); const concat = require('gulp-concat'); cons

如下面的gulpfile.js所示,我正在尝试将jQuery、bootstrap.js和子文件夹中的Javascript片段集合编译成单个app.js输出文件。它正在工作,只是子文件夹中的代码片段在加载jQuery之前出现在app.js输出文件的顶部

如何确保这些文件以正确的顺序输出

const { src, dest, watch, series, parallel } = require('gulp');
const concat = require('gulp-concat');
const uglify = require('gulp-uglify');
var merge2 = require('merge2');

const files = {
  jsSrcPath: [
    '../node_modules/jquery/dist/jquery.js',
    '../node_modules/bootstrap/dist/js/bootstrap.js',
    'js/*.js'
  ],
  jsDstPath: '../public/js'
}

function jsTask(){
  return merge2(files.jsSrcPath.map(function (file) {
    return src(file)
  }))
  .pipe(concat('app.js'))
  .pipe(uglify())
  .pipe(dest(files.jsDstPath));
}

function watchTask(){
    watch(files.jsSrcPath, jsTask);
}

exports.default = series(
    jsTask,
    watchTask
);

这里有一些内在的东西,在我的测试中,我看到顺序有时是随机的,有时是基于修改时间的,有时是按顺序的。在任何情况下,最好使用一个工具来确保我们的流总是按照我们想要的顺序进行

为此目的而存在。它可以采用您已有的特定路径和glob语法,因此您可以将其重新传递给插件:

const { src, dest, watch, series, parallel } = require('gulp');
const concat = require('gulp-concat');
const uglify = require('gulp-uglify');
const order = require('gulp-order'); // Added
var merge2 = require('merge2');

const files = {
  jsSrcPath: [
    '../node_modules/jquery/dist/jquery.js',
    '../node_modules/bootstrap/dist/js/bootstrap.js',
    'js/*.js'
  ],
  jsDstPath: 'dist'
}

function jsTask() {
  return merge2(files.jsSrcPath.map(function (file) {
    return src(file)
  }))
    .pipe(order(files.jsSrcPath)) // Added
    .pipe(concat('app.js'))
    .pipe(uglify())
    .pipe(dest(files.jsDstPath));
}

function watchTask() {
  watch(files.jsSrcPath, jsTask);
}

exports.default = series(
  jsTask,
  watchTask
);

是的,我注意到其他一些项目的顺序似乎是随机的。我不知道要喝什么。我按照您所描述的方式设置了它,但它并没有解决这个问题,但是我做了一些进一步的挖掘,发现有必要像这样将基本路径传递给order:.pipe(order(order(files.jsSrcPath,{base:'.}))添加使其工作。接受你的回答。我将让您决定是否使用该参数更新代码示例。非常感谢!