elm-webpack

gistfile1.txt

const webpack = require('webpack');
const path = require('path');
const glob = require('glob');
const merge = require('webpack-merge');
const ClosurePlugin = require('closure-webpack-plugin');
const MiniCssExtractPlugin = require('mini-css-extract-plugin');
const OptimizeCSSAssetsPlugin = require('optimize-css-assets-webpack-plugin');
const CopyWebpackPlugin = require('copy-webpack-plugin');
const MergeIntoSingleFilePlugin = require('webpack-merge-and-include-globally');

bundleVendorLibs = new MergeIntoSingleFilePlugin({
    files: {
        "./js/vendor.bundle.js": [
            path.resolve(__dirname, 'vendor/jquery-2.2.4.min.js'),
            path.resolve(__dirname, 'vendor/jquery-ui.min.js'),
            path.resolve(__dirname, 'vendor/bootstrap.min.js'),
            path.resolve(__dirname, 'vendor/markdown.min.js'),
            path.resolve(__dirname, 'vendor/to-markdown.js'),
            path.resolve(__dirname, 'vendor/jquery.fontselect.min.js'),
            path.resolve(__dirname, 'vendor/modernizr-custom.js'),
            path.resolve(__dirname, 'vendor/jquery.datetimepicker.full.min.js'),
            path.resolve(__dirname, 'vendor/bootstrap-multiselect.js'),
            path.resolve(__dirname, 'node_modules/bootstrap-markdown/js/bootstrap-markdown.js'),
            path.resolve(__dirname, 'node_modules/bootstrap-markdown/locale/bootstrap-markdown.ru.js'),
            path.resolve(__dirname, 'node_modules/bootstrap-colorpicker/dist/js/bootstrap-colorpicker.min.js'),
            path.resolve(__dirname, 'node_modules/typeahead.js/dist/typeahead.bundle.min.js'),
            path.resolve(__dirname, 'node_modules/bootstrap-tagsinput/dist/bootstrap-tagsinput.min.js')
        ]
    }
});

var common = {
    entry: {
        './js/app.js': ['./js/app.js'], // .concat(glob.sync('./vendor/**/*.js')),
        './js/socket.js': ['./js/socket.js'],
        './css/modular.css': ['./less/app.less'],
        './js/character_creation_page.js': ['./js/character_creation_page.js'],
        './js/character_development_page.js': ['./js/character_development_page.js'],
        './js/crafter_widget.js': ['./js/crafter_widget.js'],
    },
    output: {
        filename: '[name]',
        path: path.resolve(__dirname, '../priv/static')
    },
    resolve: {
        extensions: ['.js', '.elm', '.less', '.css'],
        modules: ['node_modules'],
    },
    module: {
        rules: [{
            test: /\.js$/,
            exclude: /(node_modules)|(vendor)/,
            use: {
                loader: 'babel-loader'
            }
        }]
    }
};

module.exports = (env, options) => {
    if (options.mode === "production") {
        return merge(common, {
            optimization: {
                minimizer: [
                    new ClosurePlugin({ mode: 'STANDARD' }, {
                        // compiler flags here
                        //
                        // for debugging help, try these:
                        //
                        // formatting: 'PRETTY_PRINT',
                        // debug: true
                        // renaming: false
                    }),
                    new OptimizeCSSAssetsPlugin({
                        assetNameRegExp: /app\.css$/g
                    })
                ]
            },
            module: {
                rules: [{
                        test: /\.elm$/,
                        exclude: [/elm-stuff/, /node_modules/],
                        use: [{
                            loader: "elm-webpack-loader",
                            options: {
                                cwd: path.resolve(__dirname, "elm"),
                                optimize: true
                            }
                        }]
                    },
                    {
                        test: /\.less$/,
                        use: [MiniCssExtractPlugin.loader, 'css-loader?url=false', 'less-loader']
                    }
                ]
            },
            plugins: [
                new MiniCssExtractPlugin({ filename: './css/app.css' }),
                bundleVendorLibs,
                new CopyWebpackPlugin([{ from: 'static/', to: './' }])
            ],
            // Detailed preset without warnings, because of ClosurePlugin spam
            stats: {
                entrypoints: true,
                chunks: true,
                chunkModules: false,
                chunkOrigins: true,
                depth: true,
                usedExports: true,
                providedExports: true,
                optimizationBailout: true,
                errorDetails: true,
                publicPath: true,
                exclude: false,
                maxModules: Infinity,
                warnings: false
            }
        });
    } else {
        return merge(common, {
            module: {
                rules: [{
                        test: /\.elm$/,
                        exclude: [/elm-stuff/, /node_modules/],
                        use: [{
                            loader: 'elm-webpack-loader',
                            options: {
                                cwd: path.resolve(__dirname, "elm"),
                                verbose: true,
                                forceWatch: true
                            }
                        }]
                    },
                    {
                        test: /\.less$/,
                        use: [MiniCssExtractPlugin.loader, 'css-loader?url=false', 'less-loader']
                    }
                ]
            },
            plugins: [
                // Suggested for hot-loading
                new webpack.NamedModulesPlugin(),
                // Prevents compilation errors causing the hot loader to lose state
                new webpack.NoEmitOnErrorsPlugin(),
                // Put clear app.css of JS junk
                new MiniCssExtractPlugin({ filename: './css/app.css' }),
                bundleVendorLibs,
                // Copy all static assets
                new CopyWebpackPlugin([{ from: 'static/', to: './' }])
            ]
        });
    }
};