How to properly build es6 modules with gulp?

Question

gulp.js

I rummaged through the entire Internet, but all the existing solutions seemed to me slightly inappropriate, somehow sharpened for a spa. Here is the file structure used:

|src                      //исходники
----|resource             //исходники стилей и изображения, это неважно
----|js
--------|partials
------------_component.js //компонент, который может использоваться в многих файлах скриптов
--------script.js         //es6 скрипт, таких есть несколько
----index.html            //таких здесь тоже несколько
|build                    //что-то такое должно быть сгенерировано
----|resource             //неважно
----|js
--------script.js         //es5 скрипт, скомпилированный babel`ем, компонент конкатенирован в месте подключения
index.html                //без изменений

Modules are declared in es6 style. Specifying each script in gulpfile.js or webpack.config.js would be too much of a chore as there would be potentially too many of them. Perhaps I just didn’t fully understand something or didn’t notice something, but I ask you to give a ready-made gulpfile with a js build task in the answer, or at least a fairly detailed explanation of how to do this, answers in the style of "dig in the direction of xxx "will help a little, since I've been digging in all directions for the third day and nothing.

Answer 1

Можно с помощью gulp + webpack или gulp + browserify или просто webpack.
Вот что использую я gulp + webpack:

let gulp = require('gulp');
    let webpackStream = require('webpack-stream');
    let webpack = webpackStream.webpack;
    let named = require('vinyl-named');

    const scripts = {
        test: /\.js$/,
        exclude: [/develop\/app/,],
        query:{
            presets: ['es2015']
        },
        loader: 'babel-loader'
    };

    const annotate = {
        test: /\.js$/,
        loader: 'ng-annotate'
    }

    const markup = {
        test: /\.html$/,
        loader: 'ngtemplate!html'
    };

    const uglify = {
        test: /\.js$/,
        loader: 'uglify'
    };

    let config = {
        devtool: 'sourcemap',
        module: {
            loaders: [uglify, scripts, annotate, markup]
        },
        plugins: [
            new webpack.NoErrorsPlugin()
        ]
    };

   gulp.task('buildModules', function(){
        return gulp.src('develop/app/myModule.js')
            .pipe(named())
            .pipe(webpackStream(config))
            .pipe(gulp.dest('build/app'))
    };