Почему Gulp объединяет мой вывод в неправильном порядке? - PullRequest
Новая
       33

Почему Gulp объединяет мой вывод в неправильном порядке?

0 голосов
/ 29 апреля 2020

Как показано в следующем файле gulpfile. js, я пытаюсь скомпилировать jQuery, bootstrap. js и коллекцию Javascript фрагментов из подпапки в одно приложение. js выходной файл. Он работает, за исключением того, что фрагменты из подпапки появляются в верхней части приложения. js выходной файл до загрузки jQuery.

Как я могу убедиться, что эти файлы выводятся в правильном порядке? 

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
);

1 Ответ

1 голос
/ 29 апреля 2020

Здесь происходит что-то внутреннее, в своих тестах я видел, что порядок был иногда случайным, иногда основанным на времени модификации, иногда в порядке. В любом случае, лучше всего использовать инструмент, чтобы наши потоки всегда были в том порядке, в котором мы их хотим.

gulp-order существует для этой цели. Он может принимать определенные c пути и синтаксис глобуса, которые у вас уже есть, так что вы можете повторно передать его плагину: 

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
);
...