main.js 404 not found and blank page when I deploy (webpack-react manually configuration)

[nazarenoalt]

Every time I create a react-app with a webpack configuration from scratch, and I deploy the project to github, I enter into the page and I find a blank page, and the console with a message

GET https://nazarenoalt.github.io/main.js net::ERR_ABORTED 404

This doesn't happen with create-react-app, only with manual configuration of react. Also this error is happening with 3 projects at this moment

CV-maker repository | CV-maker page
react-shop repository | react-shop page

(the third is private right now)

Package.json

{
  "name": "cv-maker",
  "version": "1.0.0",
  "description": "",
  "homepage": "https://nazarenoalt.github.io/CV-maker",
  "main": "index.js",
  "scripts": {
    "start": "webpack serve --open",
    "build": "webpack --mode production",
    "deploy": "gh-pages -d build"
  },
  "keywords": [],
  "author": "",
  "license": "ISC",
  "devDependencies": {
    "@babel/core": "^7.16.0",
    "@babel/preset-env": "^7.16.4",
    "@babel/preset-react": "^7.16.0",
    "babel-loader": "^8.2.3",
    "css-loader": "^6.5.1",
    "file-loader": "^6.2.0",
    "html-loader": "^3.0.1",
    "html-webpack-plugin": "^5.5.0",
    "mini-css-extract-plugin": "^2.4.5",
    "react": "^17.0.2",
    "react-dom": "^17.0.2",
    "style-loader": "^3.3.1",
    "webpack": "^5.64.1",
    "webpack-cli": "^4.9.1",
    "webpack-dev-server": "^4.5.0"
  },
  "dependencies": {
    "html2pdf.js": "^0.10.1",
    "gh-pages": "^3.2.3"
  }
}

webpack.config.js

const HtmlWebpackPlugin = require("html-webpack-plugin");
const MiniCssExtractPlugin = require("mini-css-extract-plugin");
const path = require("path");

module.exports = {
  mode: "development",
  entry: "./src/index.js",
  output: {
    path: path.resolve(__dirname, "build"),
    publicPath: "/",
    filename:"main.js"
  },
  resolve: {
    extensions: [".js",".jsx"],
  },
  module: {
    rules: [
      {
        test: /\.(js|jsx)$/,
        exclude: /node_modules/,
        use: [
          {
            loader: "babel-loader"
          }
        ]
      },
      {
        test: /\.html/,
        use: [
          {
            loader: "html-loader"
          }
        ]
      },
      {
        test: /\.css/,
        use: [
          "css-loader",
          "style-loader"
        ]
      },
      {
        test: /\.(png|jp(e*)g|gif|svg)/,
        use: [
          {
            loader: "file-loader"
          }
        ]
      }
    ]
  },
  plugins: [
    new HtmlWebpackPlugin({
      template: "./public/index.html",
      filename:"index.html",
    }),
    new MiniCssExtractPlugin({
      filename: "[name].css"
    })
  ]
}

Consider these things:

• Deployment is successful
• The branch and Pages is correctly configurated to gh-pages
• Into gh-pages branch I find the main.js