Как импортировать пакеты в js файл используя Gulp и Webpack?

Question

[biz53]

Сейчас я могу импортировать у меня есть главный js-файл script.js и я могу импортировать туда все свои скрипты через export default function. Выглядит это следующим образом:

"use strict";
import mainSliders from './main__sliders.js';

document.addEventListener("DOMContentLoaded", function () {
	mainSliders();
});

Но при таком раскладе, мне приходится добавлять библиотеки через HTML файл.

<script src="assets/js/lib/swiper/swiper.min.js"></script>
<script src="assets/js/script.min.js"></script>

И собственно вопрос: как мне сделать так, чтобы я мог импортировать библиотеки в сам js и у меня получался один файл js, куда уже включены все нужные библиотеки и который я бы смог подключить в HTML?

<script src="assets/js/script.min.js"></script>

Так настроен мой галп таск для скриптов:

function scripts(modeName) {
    return gulp.src(src.js)
    .pipe(webpack({
        watch: false,
        mode: modeName,
        module: {
          rules: [
            { test: /\.(js)$/ },
          ],
        },
        
        stats: 'errors-only'
    }))
    .pipe(babel())
    .on('error', console.error.bind(console))
    .pipe(concat(`script.js`))
        .pipe(gulp.dest(build.js))
    .pipe(uglify({
        toplevel: true
    }))
        .pipe(
            rename({
                extname: ".min.js"
            })
        )

    .pipe(gulp.dest(build.js))
    .pipe(browserSync.stream())
}

const buildScripts = () => scripts('production');
const devScripts = () => scripts('development');

gulp.task('build', gulp.series(clean, grid, gulp.parallel(fonts, html, styles, buildScripts, compress, retina, libraries)));

gulp.task('watch', gulp.series(clean, grid, gulp.parallel(fonts, html, styles, devScripts, compress, libraries), watch));