настроить веб-пакет JS и стилус компилятор

Question

У меня есть структура в моем проекте, равная app / modules / module1, app / modules / module2 и т. Д. ... И я хотел бы настроить конструктор веб-пакетов с помощью babel, стилуса и нескольких входных файлов одновременно, а также несколькихвыход х.Мне это нужно, потому что я делаю рефакторинг старого проекта в современный синтаксис.

На моей записи у меня есть:

app/modules/module1/script.js,
app/modules/module1/main.styl

app/modules/module2/script.js,
app/modules/module2/main.styl 

и т. Д. *

На моем выходе янужно:

public/module1/main.css
public/module1/script.js

public/module2/main.css
public/module2/script.js

Пока я застрял, как настроить такой сложный webpack.config, который скомпилирует странный код

var webpack = require( 'webpack' );
var glob = require( 'glob' );
const path = require('path');
const CleanWebpackPlugin = require('clean-webpack-plugin');
const MiniCssExtractPlugin = require('mini-css-extract-plugin');
const ManifestPlugin = require('webpack-manifest-plugin');

const pkg = require('./package.json');

//Generate object for webpack entry
//rename './app/modules/module1/script.js' -> 'module1/script'
var entryObject = glob.sync( '{./app/modules/**/script.js,./app/modules/**/main.styl}' ).reduce(
    function ( entries, entry ) {
        var matchForRename = /^\.\/app\/modules\/([\w\d_]+\/(script|main))\.(js|styl)$/g.exec( entry );
        if (matchForRename !== null && typeof matchForRename[1] !== 'undefined') {
            if(matchForRename[3] === "js") {
                entries[matchForRename[1] + ".js"] = entry;
            } else if (matchForRename[3] === "styl") {
                entries[matchForRename[1] + ".css"] = entry;
            }
        }
        return entries;
    },
    {}
);


module.exports = {

    entry: entryObject,//{'moduleName/script': './app/modules/moduleName/script.js', ...}
    output: {
        path: __dirname + '/public/js',
        filename: '[name]'//'moduleName/script.js', [name] - key from entryObject
    },
    module: {
        rules: [
            {
                test: /\.js?$/,
                loader: 'babel-loader',
                exclude: path.resolve(__dirname, 'node_modules')
            },
            {
                test: /\.(ico|png|jpg|svg)$/,
                loader: 'file-loader',
                options: {
                    name: '[name].[ext]'
                },
                exclude: path.resolve(__dirname, 'node_modules')
            },
            {
                test: /\.styl$/,
                use: [
                    MiniCssExtractPlugin.loader,
                    "css-loader",
                    "stylus-loader"
                ],
                exclude: path.resolve(__dirname, 'node_modules')
            }
        ]
    },
    resolve: {
        extensions: ['.js', '.styl']
    },
    plugins: [
        new CleanWebpackPlugin(),
        new MiniCssExtractPlugin({
            filename: '[name].css' // TODO: [name].[hash].min.css
        }),
        new ManifestPlugin()
    ]

};

Если у кого-то был опыт настройки такой архитектуры, пожалуйста, помогите закончить.