const path = require('path');
const webpack = require('webpack');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const BrowserSyncPlugin = require('browser-sync-webpack-plugin');
const CleanWebpackPlugin = require('clean-webpack-plugin');
const UglifyJsPlugin = require('uglifyjs-webpack-plugin');

module.exports = env => {
    let babelPlugins = [
        "@babel/plugin-proposal-class-properties",
        "@babel/plugin-proposal-object-rest-spread",
        "babel-plugin-styled-components"
    ];

    let mode = "development";
    let entry = './src/js/Main';
    let outputPath = path.resolve(__dirname, 'dist/js');
    let outputName = 'script.js';

    let webpackPlugins = [
        new CleanWebpackPlugin(['dist'], {verbose: true})
    ];

    switch(env.NODE_ENV){
        case 'dev':

            webpackPlugins.push(
                new HtmlWebpackPlugin({
                    title: 'quarks-ui-component',
                    filename: '../index.html',
                    template: './src/index.html',
                    inject: false,
                    minify: {
                        collapseWhitespace: true
                    }
                }),

                new BrowserSyncPlugin({
                    host: 'localhost',
                    port: 9000,
                    server: {
                        baseDir: ['./dist']
                    }
                })
            );

            break;
        case 'prod':
            mode = 'production';
            entry = './src/js/index';
            outputPath = path.resolve(__dirname, 'dist');
            outputName = 'expectrum.min.js';

            webpackPlugins.push(
                new UglifyJsPlugin({
                    sourceMap: true,
                    uglifyOptions: {
                        ecma: 8,
                        warnings: false,
                        output: {
                            comments: false,
                            beautify: false
                        }
                    }
                })
            );
            break;
    }

    return {

        devtool: 'source-map',
        entry: ['./src/js/Main'],
        mode: mode,
        output: {
            path: outputPath,
            filename: outputName,
            publicPath: '/'
        },

        module: {
            rules: [
                {
                    test: /\.js$/,
                    include: [path.resolve(__dirname, 'src/js/')],
                    loader: 'babel-loader',
                    options: {
                        presets: ['@babel/preset-react', '@babel/preset-env'],
                        plugins: babelPlugins
                    }
                },

                {
                    test: /\.eot$/,
                    include: [path.resolve(__dirname, 'src/js/expectrum/styles')],
                    loader: 'url-loader',
                    options: {
                        limit: 65000,
                        mimetype: 'application/vnd.ms-fontobject'
                    }
                },
                {
                    test: /\.(jpe?g|png|gif|svg)$/i,
                    loader: "file-loader?name=/public/[name].[ext]"
                }
            ]
        },

        plugins: webpackPlugins
    }
}
