'use strict';

const path = require('path');
const webpack = require('webpack');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const CaseSensitivePathsPlugin = require('case-sensitive-paths-webpack-plugin');
const InterpolateHtmlPlugin = require('react-dev-utils/InterpolateHtmlPlugin');
const ForkTsCheckerWebpackPlugin = require('fork-ts-checker-webpack-plugin');
const getClientEnvironment = require('./env');
const paths = require('./paths');
const TsconfigPathsPlugin = require('tsconfig-paths-webpack-plugin');
const NodePolyfillPlugin = require('node-polyfill-webpack-plugin');
const publicPath = '/';
const publicUrl = '';
const env = getClientEnvironment(publicUrl);
const entry = [
    require.resolve('./polyfills')
];

if (process.env.ADDITIONAL_POLYFILLS) {
    entry.push(...process.env.ADDITIONAL_POLYFILLS.split(',').map((polyfill) => {
        return require.resolve(polyfill);
    }));
}

entry.push(require.resolve('react-dev-utils/webpackHotDevClient'));
entry.push(paths.appIndexJs);

const config = {
    mode: 'development',
    devtool: 'cheap-module-source-map',
    entry,
    output: {
        pathinfo: true,
        filename: 'static/js/bundle.js',
        chunkFilename: 'static/js/[name].chunk.js',
        publicPath: publicPath,
        devtoolModuleFilenameTemplate: info =>
            path.resolve(info.absoluteResourcePath).replace(/\\/g, '/'),
    },
    resolve: {
        fallback: {
            fs: false,
            dgram: false,
            net: false,
            tls: false,
            child_process: false
        },
        modules: ['node_modules', paths.appNodeModules].concat(
            process.env.NODE_PATH.split(path.delimiter).filter(Boolean)
        ),
        extensions: [
            '.mjs',
            '.web.ts',
            '.ts',
            '.web.tsx',
            '.tsx',
            '.web.js',
            '.js',
            '.json',
            '.web.jsx',
            '.jsx',
        ],
        alias: {
            'react-native': 'react-native-web',
        },
        plugins: [
            new TsconfigPathsPlugin({configFile: paths.appTsConfig}),
        ],
    },
    module: {
        strictExportPresence: true,
        rules: [
            {
                test: /\.(js|jsx|mjs)$/,
                loader: require.resolve('source-map-loader'),
                enforce: 'pre'
            },
            {
                oneOf: [
                    {
                        test: [/\.bmp$/, /\.gif$/, /\.jpe?g$/, /\.png$/],
                        type: 'asset',
                        generator: {
                            filename: 'static/media/[name].[hash:8].[ext]',
                        },
                        parser: {
                            dataUrlCondition: {
                                maxSize: 10 * 1024 // 10kb
                            }
                        }
                    },
                    {
                        test: /\.(js|jsx|mjs)$/,
                        include: paths.appSrc,
                        use: [{
                            loader: require.resolve('babel-loader'),
                            options: {
                                compact: true,
                            },
                        },]
                    },
                    {
                        test: /\.(ts|tsx)$/,
                        use: [{loader: require.resolve('ts-loader')}],
                    },
                    {
                        test: /\.scss$/,
                        use: [{
                            loader: "style-loader"
                        }, {
                            loader: "css-loader",
                            options: {
                                url: {
                                    filter: (url, resourcePath) => {
                                        return !url.startsWith('/');
                                    },
                                }
                            }
                        }, {
                            loader: "sass-loader"
                        }]
                    },
                    {
                        exclude: [/\.(js|jsx|mjs)$/, /\.html$/, /\.json$/],
                        type: 'asset/resource',
                        generator: {
                            filename: 'static/media/[name].[hash:8].[ext]',
                        },
                    },
                ],
            },
        ],
    },
    plugins: [
        new InterpolateHtmlPlugin(HtmlWebpackPlugin, env.raw),
        new HtmlWebpackPlugin({
            inject: true,
            template: paths.appHtml,
        }),
        new webpack.DefinePlugin(env.stringified),
        new webpack.HotModuleReplacementPlugin(),
        new CaseSensitivePathsPlugin(),
        new webpack.IgnorePlugin({
            resourceRegExp: /^\.\/locale$/,
            contextRegExp: /moment$/
        }),
        new ForkTsCheckerWebpackPlugin({
            async: false,
            typescript: {
                configFile: paths.appTsConfig
            }
        }),
        new NodePolyfillPlugin(),
    ],
    performance: {
        hints: false,
    },
};

module.exports = config;