const path = require('path')
const glob = require('glob')
const webpack = require('webpack')
// const MiniCssExtractPlugin = require('mini-css-extract-plugin')

module.exports = (env, argv) => {
    return {
        mode: 'development',
        entry: {
            main: './frontend/src/index.tsx'
        },
        devtool: 'inline-source-map',
        output: {
            filename: 'javascripts/[name].js',
            path: path.resolve('./public/assets/')
        },
        plugins: [
            // new MiniCssExtractPlugin({
            //     filename: 'stylesheets/[name]-[hash].css'
            // }),
            // new ManifestPlugin({
            //     writeToFileEmit: true
            // }),
            // new webpack.HotModuleReplacementPlugin()
        ],
        module: {
            rules: [
              {
                test: /\.tsx?$/,
                use: 'ts-loader',
                exclude: /node_modules/,
              },
              {
                test: /\.css$/,
                use: ['style-loader', 'css-loader']
              },
              {
                test: /\.(png|svg|jpg|jpeg|gif|ico)$/,
                exclude: /node_modules/,
                use: ['file-loader?name=[name].[ext]'] // ?name=[name].[ext] is only necessary to preserve the original file name
              }
            ]
        },
        resolve: {
            // modules: [
            //     "node_modules",
            //     path.resolve('./frontend/src'),
            // ],
          extensions: [ '.tsx', '.ts', '.js' ],
        },
        optimization: {
            splitChunks: {
                cacheGroups: {
                    vendor: {
                        test: /.(c|sa)ss/,
                        name: 'style',
                        chunks: 'all',
                        enforce: true
                    }
                }
            },
            minimize: true
        },
        devServer: {
            watchContentBase: true,
            host: 'localhost',
            port: 9000,
            hot: true,
            publicPath: '/assets/',
            historyApiFallback: true,
        }
    }
}