Порядок сборки js файлов в gulp?

Question

[Антон Шелестов]

Ребят, вообще не пойму как работает порядок сборки js скриптов
Есть подключаемые скрипты:

import $ from 'jquery'
import select2 from 'select2';
select2(window, $);

import FancyBox from '@fancyapps/fancybox';

import Swiper, {Scrollbar, Mousewheel, Navigation} from 'swiper';
Swiper.use([Scrollbar, Mousewheel, Navigation]);

И почему-то FancyBox подключается раньше всех и из-за этого ругается что нет jQuery
Почему так происходит? как лечится?

Спасибо!

Comments

[Alex]

Ничего не понятно из вопроса. Это код чего? Тот что вы написали? Или тот что скомпилировался? Как компилируете? Что используете? Что писали? Что получилось? Я бы и рад помочь, если бы понимал в чем вопрос ...

[Антон Шелестов]

gulp задача собирающая js скрипты:

const gulp = require('gulp');
const eslint = require('gulp-eslint');
const concat = require('gulp-concat');
const babel = require('gulp-babel');
const browserify = require('browserify');
const babelify = require('babelify');
const terser = require('gulp-terser');
const rename = require('gulp-rename');
const sourcemaps = require('gulp-sourcemaps');
const source = require('vinyl-source-stream');
const buffer = require('vinyl-buffer');

module.exports = function script(cb) {
    return browserify({
        entries: [
            'src/scripts/scripts.js'
        ],
        transform: [
            babelify.configure({ presets: ['@babel/preset-env'] }),
        ],
    })
        .bundle()
        .pipe(source('scripts.js'))
        .pipe(buffer())
        .pipe(sourcemaps.init())
        .pipe(concat('scripts.js')) // Конкатенируем в один файл
        .pipe(terser())
        .pipe(sourcemaps.write())
        .pipe(rename({suffix: '.min'}))
        .pipe(gulp.dest('build/js'));
};

сам файл scripts.js

import $ from 'jquery'
import select2 from 'select2';
select2(window, $);

import FancyBox from '@fancyapps/fancybox';

import Swiper, {Scrollbar, Mousewheel, Navigation} from 'swiper';
Swiper.use([Scrollbar, Mousewheel, Navigation]);

window.onload = function () {
 // тут код
};

И в итоге получается что все собирается, но почему-то плагин fancybox записывается до определение jquery и возникает ошибка