const path = require( 'path' );
const UglifyJsPlugin = require( 'uglifyjs-webpack-plugin' );
const MiniCssExtractPlugin = require('mini-css-extract-plugin');

// DIR Paths
const JS_DIR = path.resolve( __dirname, 'src' );
const BUILD_DIR = path.resolve( __dirname, 'dist' );
const CSS_DIR = path.resolve(__dirname, '../css');
const SCSS_DIR = path.resolve( __dirname, '../scss' );

// Output Scripts
const output = {
    path: BUILD_DIR,
    filename: '[name].build.min.js',
}

// Rules
const rules = [
    {
        test: /\.js$/,
        include: [ JS_DIR ],
        exclude: /node_modules/,
        use: 'babel-loader'
    },

]

// Plugins
const plugins = ( argv ) => {}

// Exporting Modules
module.exports = [
    {
        entry: {
            block: `${JS_DIR}/block.js`,
            activityCentre: `${JS_DIR}/sidebar/activityCentre.js`,
            dashboard: `${JS_DIR}/dashboard/index.js`,
            userTour: `${JS_DIR}/userTour/index.js`,
            welcomeTour: `${JS_DIR}/welcomeTour/index.js`,
        },
        output: output,
        devtool: 'source-map',
        module: {
            rules: rules,
        },
        optimization: {
            minimizer: [
                new UglifyJsPlugin({
                    cache: false,
                    parallel: true,
                    sourceMap: false,
                    /*uglifyOptions: {
                        output: {
                        comments: /\<\/?fs_premium_only\>/i,
                        },
                    },
                    extractComments: true,*/
                }),
            ], 
        }
    },
    {
        entry: {
            frontStyle: `${SCSS_DIR}/front.scss`,
            editorStyle: `${SCSS_DIR}/editor.scss`,
            dashboardeditorStyle: `${SCSS_DIR}/dashboardeditor.scss`,
        },
        module: {
            rules: [
                {
                    test: /\.scss$/,
                    exclude: /(node_modules)/,
                    use: [
                        MiniCssExtractPlugin.loader,
                        'css-loader',
                        {
                            loader: 'sass-loader',
                            options: {
                                implementation: require('sass'), 
                            },
                        },
                    ]
                },
                {
                    test: /\.css$/,
                    exclude: /(node_modules)/,
                    use: [
                        MiniCssExtractPlugin.loader,
                        'style-loader',
                        'css-loader'
                    ]
                },
            
                {
                    test: /\.(png|jpg|jpeg|svg|webp)$/,
                    use: [
                      {
                        loader: 'url-loader',
                        options: {
                          limit: 8192, // You can adjust this limit based on your project requirements
                          name: '[name].[ext]',
                          publicPath: '../images/', // Adjust this path based on your folder structure
                        },
                      },
                    ],
                  },
            ]
        },
        plugins: [
            new MiniCssExtractPlugin({
            filename: 'styles/[name].build.min.css'
            })
        ],
        
    },
]