const path = require('path');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const webpack = require('webpack');
const Dotenv = require('dotenv-webpack');

module.exports = (env) => ({
    mode: env.mode ?? 'development',
    entry: './src/index.tsx',
    watchOptions: {
        ignored: /node_modules/,
        poll: 1000,
        aggregateTimeout: 300,
    },
    devServer: {
        static: path.join(__dirname, 'public'),
        historyApiFallback: true,
        hot: true,
    },
    plugins: [
        new HtmlWebpackPlugin({
            title: 'title text',
            template: 'public/index.html',

        }),
        new webpack.SourceMapDevToolPlugin({
            filename: '[name].[contenthash].map',
        }),
        new Dotenv({
            path: `.env${env.mode ? '.' + env.mode : ''}`,
            systemvars: true,
            allowEmptyValues: true,
            safe: false,
        }),
        new webpack.DefinePlugin({
            'process.env.NODE_ENV': JSON.stringify(env.mode ?? 'development')
        }),
    ],
    output: {
        filename: '[name].[contenthash].js',
        path: path.resolve(__dirname, 'dist'),
        clean: true,
        publicPath: '/',
    },
    resolve: {
        extensions: ['.tsx', '.ts', '.js'],
        modules: [
            'node_modules',
            path.resolve(__dirname, 'src'),
        ],
        alias: {
            '~': path.resolve(__dirname, 'src'),
            "react/jsx-dev-runtime": "react/jsx-dev-runtime.js",
            "react/jsx-runtime": "react/jsx-runtime.js",
        },
    },
    module: {
        rules: [
            {
                test: /\.(tsx|ts)$/,
                exclude: /node_modules/,
                use: {
                    loader: "babel-loader",
                    options: {
                        presets: [
                            '@babel/preset-env',
                            '@babel/preset-typescript',
                            '@babel/preset-react',
                        ],
                        plugins: [
                            [
                                "effector/babel-plugin", {
                                "reactSsr": false,
                                "addLoc": true,
                                "debug": true
                            }
                            ]
                        ]
                    }
                }
            },
            {
                test: /\.s?[ac]ss$/i,
                use: ['style-loader', 'css-loader', 'sass-loader'],
            },
            // {
            //     test: /\.tsx?$/,
            //     use: 'ts-loader',
            //     include: path.resolve(__dirname, 'src'),
            //     exclude: /node_modules/,
            // },
            {
                test: /\.(png|jpg|gif)$/i,
                type: 'asset/resource',
                include: path.resolve(__dirname, 'src'),
                exclude: /node_modules/,
            },
        ],
    },
    optimization: {
        minimize: false
        // moduleIds: 'deterministic',
        // runtimeChunk: 'single',
        // splitChunks: {
        //     cacheGroups: {
        //         vendor: {
        //             test: /[\\/]node_modules[\\/]/,
        //             name: 'vendors',
        //             chunks: 'all',
        //         },
        //     },
        // },
        // usedExports: true,
    },
});