/* eslint-disable @typescript-eslint/no-var-requires */ const HtmlWebpackPlugin = require("html-webpack-plugin"); const webpack = require("webpack"); const path = require("path"); const { CleanWebpackPlugin } = require("clean-webpack-plugin"); const CopyPlugin = require("copy-webpack-plugin"); const dotenv = require("dotenv"); const dotenvConfig = dotenv && dotenv.config && dotenv.config(); const env = (dotenvConfig && dotenvConfig.parsed) || process.env; const envKeys = Object.keys(env).reduce((prev, next) => { // eslint-disable-next-line no-param-reassign prev[`process.env.${next}`] = JSON.stringify(env[next]); return prev; }, {}); envKeys["process.env"] = JSON.stringify(env); const isDevelopment = process.env.NODE_ENV === "development"; module.exports = { entry: "./src/index.tsx", output: { filename: "[name].[contenthash].bundle.js", chunkFilename: "[name].[contenthash].bundle.js", path: path.resolve(__dirname, "dist"), publicPath: "/", }, performance: { hints: false }, plugins: [ new webpack.DefinePlugin(envKeys), new CleanWebpackPlugin(), new CopyPlugin({ patterns: [ { from: path.resolve(__dirname, "public"), globOptions: { ignore: ["**/index.html"], }, noErrorOnMissing: true, }, ], }), new HtmlWebpackPlugin({ template: "./public/index.html", }), ], resolve: { modules: [__dirname, "src", "node_modules"], extensions: ["*", ".js", ".jsx", ".tsx", ".ts"], alias: { "@src": path.resolve(__dirname, "src/"), }, }, module: { rules: [ { test: /\.tsx?$/, exclude: /node_modules/, use: [ { loader: require.resolve("babel-loader"), options: { plugins: [ isDevelopment && require.resolve("react-refresh/babel"), ].filter(Boolean), }, }, ], }, { test: /\.(png|jpe?g|svg|woff2?|ttf|eot)$/, type: "asset", parser: { dataUrlCondition: { maxSize: 8192, }, }, generator: { filename: "assets/[name].[contenthash][ext]", }, }, ], }, optimization: { splitChunks: { cacheGroups: { defaultVendors: { test: /node_modules/, chunks: "initial", name: "vendor", enforce: true, }, }, }, }, };