I found this solution on StackOverflow and tried that but It didn't work for me. Github pages still shows README after deploying React app

I think the main mistake I did is that I installed gh-pages in my previous branch npm install gh-pages --save and push that branch to Github and merge that with the main branch.

package.json

{
  "private": true,
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "start": "webpack serve --open",
    "build": "webpack"
  },
  "devDependencies": {
    "babel-eslint": "^10.1.0",
    "css-loader": "^6.2.0",
    "eslint": "^7.32.0",
    "eslint-config-airbnb-base": "^14.2.1",
    "eslint-plugin-import": "^2.24.0",
    "gh-pages": "^3.2.3",
    "hint": "^6.1.4",
    "html-webpack-plugin": "^5.3.2",
    "style-loader": "^3.2.1",
    "stylelint": "^13.13.1",
    "stylelint-config-standard": "^21.0.0",
    "stylelint-csstree-validator": "^1.9.0",
    "stylelint-scss": "^3.20.1",
    "webpack": "^5.50.0",
    "webpack-cli": "^4.8.0",
    "webpack-dev-server": "^3.11.2"
  }
}