React 应用程序在 git 页面上部署后显示空白页面

Question

我已经构建了一个 React 项目，将其部署到 GitHub 页面后看到一个空白页面。我尝试了多种方法，但没有任何效果。

这是

package.json

文件：

{
  "homepage": "https://farabi-momin.github.io/react_test ",
  "name": "react",
  "private": true,
  "version": "0.0.0",
  "type": "module",
  "scripts": {
    "predeploy": "npm run build",
    "deploy": "gh-pages -d build",
    "dev": "vite",
    "build": "vite build",
    "lint": "eslint .",
    "preview": "vite preview"
  },
  "dependencies": {
    "react": "^18.3.1",
    "react-dom": "^18.3.1",
    "react-player": "^2.16.0",
    "react-router-dom": "^6.28.0",
    "react-router-hash-link": "^2.4.3",
    "react-slick": "^0.30.2",
    "slick-carousel": "^1.8.1",
    "validator": "^13.12.0"
  },
  "devDependencies": {
    "@eslint/js": "^9.13.0",
    "@types/react": "^18.3.12",
    "@types/react-dom": "^18.3.1",
    "@vitejs/plugin-react": "^4.3.3",
    "eslint": "^9.13.0",
    "eslint-plugin-react": "^7.37.2",
    "eslint-plugin-react-hooks": "^5.0.0",
    "eslint-plugin-react-refresh": "^0.4.14",
    "gh-pages": "^6.2.0",
    "globals": "^15.11.0",
    "vite": "^5.4.10"
  }
}

如果我尝试使用

npm run deploy

运行部署，命令提示符上会显示以下错误。

这是我的 GitHub 存储库 成功部署后 git 页面设置中也没有

gh-pages

分支选项

Error: ENOENT: no such file or directory, stat 'E:\\reactProject\\Assignment1\\build'
at Object.statSync (node:fs:1658:25)
at Object.statSync (E:\\reactProject\\Assignment1\\node_modules\\graceful-fs\\polyfills.js:319:16)
at Object.publish (E:\\reactProject\\Assignment1\\node_modules\\gh-pages\\lib\\index.js:90:13)
at E:\\reactProject\\Assignment1\\node_modules\\gh-pages\\bin\\gh-pages.js:12:13
at new Promise (\<anonymous\>)
at publish (E:\\reactProject\\Assignment1\\node_modules\\gh-pages\\bin\\gh-pages.js:10:10)
at E:\\reactProject\\Assignment1\\node_modules\\gh-pages\\bin\\gh-pages.js:140:12

Answer 1

1. 根据您的

   package.json

   ，您需要在

   npm run predeploy

   之前运行

   npm run deploy

   。
2. 默认情况下，Vite 输出目录是

   dist

   ，而不是

   build

   。修改

   package.json

   ：

   -    "deploy": "gh-pages -d build",
   +    "deploy": "gh-pages -d dist",