Why is my basic React app heavy after webpack build? - reactjs

Question

I have a basic React app (2 small pages and a redux store), which is supposed to be very light. But when building the final bundle, webpack tells me that the bundle is 1.12 MiB, while the recommended limit is 244 KiB. Yet, I have made optimisations, with Terser plugin & code splitting.
Here is my webpack.config.js:
const path = require("path");
const TerserPlugin = require("terser-webpack-plugin");
const Dotenv = require("dotenv-webpack");
const HtmlWebpackPlugin = require("html-webpack-plugin");
module.exports = () => {
const env = require("dotenv").config({ path: __dirname + "/.env" });
return {
mode: "development",
entry: "./src/Index.js",
output: {
path: path.join(__dirname, "./dist"),
filename: "[name].[hash].bundle.js",
publicPath: "/",
},
resolve: {
extensions: [".js", "jsx", ".json"],
alias: {
components: path.resolve(__dirname, "src/components/"),
pages: path.resolve(__dirname, "src/pages/"),
store: path.resolve(__dirname, "src/store/"),
src: path.resolve(__dirname, "src/"),
},
},
module: {
rules: [
{
test: /\.(js|jsx)$/,
exclude: /node_modules/,
use: { loader: "babel-loader" },
},
{ test: /\.css$/, use: ["style-loader", "css-loader"] },
{ test: /\.(png|svg|jpg|gif)$/, use: ["file-loader"] },
{ test: /\.html$/, use: [{ loader: "html-loader" }] },
],
},
devServer: {
historyApiFallback: true,
port: 3000,
hot: true,
},
plugins: [
new HtmlWebpackPlugin({
template: "./src/index.html",
}),
new Dotenv(),
],
optimization: {
minimize: true,
minimizer: [new TerserPlugin()],
splitChunks: { chunks: "all" },
},
};
};
And here is my package.json:
{
"name": "app",
"version": "1.0.0",
"main": "index.js",
"license": "MIT",
"scripts": {
"start": "webpack-dev-server --mode development --open --hot",
"build": "webpack --mode production",
},
"dependencies": {
"react": "^16.13.1",
"react-dom": "^16.13.1",
"react-redux": "^7.2.0",
"react-router-dom": "^5.2.0",
"redux": "^4.0.5"
},
"devDependencies": {
"#babel/core": "^7.10.3",
"#babel/plugin-transform-runtime": "^7.10.3",
"#babel/preset-env": "^7.10.3",
"#babel/preset-react": "^7.10.1",
"babel-loader": "^8.1.0",
"dotenv-webpack": "^1.8.0",
"html-loader": "^1.1.0",
"html-webpack-plugin": "^4.3.0",
"terser-webpack-plugin": "^3.0.6",
"webpack": "^4.43.0",
"webpack-cli": "^3.3.12",
"webpack-dev-server": "^3.11.0"
}
}
How to fix this?