“错误:在 React 应用程序的 Vercel 部署中找不到名为“build”的输出目录

问题描述 投票:0回答:1

我正在尝试在 Vercel 上部署全栈应用程序(Node.js 后端和 React 前端)。但是,我不断遇到错误:

数学 复制代码 错误:构建完成后找不到名为“build”的输出目录。您可以在项目设置中配置输出目录。

{
    "builds": [
        {
            "src": "backend/app.js",
            "use": "@vercel/node"
        },
        {
            "src": "frontend/package.json",
            "use": "@vercel/static-build",
            "config": {
                "distDir": "frontend/build"  // This is where your build folder is located
            }
        }
    ],
    "routes": [
        {
            "src": "/api/(.*)",
            "dest": "/backend/app.js"
        },
        {
            "src": "/(.*)",
            "dest": "/frontend/build/$1"
        }
    ]
}


{
    "name": "frontend",
    "version": "0.1.0",
    "private": true,
    "dependencies": {
        "@emotion/react": "^11.13.3",
        "@emotion/styled": "^11.13.0",
        "@mui/icons-material": "^6.1.0",
        "@mui/material": "^6.1.0",
        "@testing-library/jest-dom": "^5.17.0",
        "@testing-library/react": "^13.4.0",
        "@testing-library/user-event": "^13.5.0",
        "axios": "^1.7.7",
        "chart.js": "^4.4.4",
        "d3": "^7.9.0",
        "react": "^18.3.1",
        "react-chartjs-2": "^5.2.0",
        "react-d3-library": "^1.1.8",
        "react-dom": "^18.3.1",
        "react-router-dom": "^6.26.2",
        "react-scripts": "5.0.1",
        "socket.io-client": "^4.7.5",
        "web-vitals": "^2.1.4"
    },
    "scripts": {
        "start": "react-scripts start",
        "build": "react-scripts build",
        "test": "react-scripts test",
        "eject": "react-scripts eject"
    },
    "eslintConfig": {
        "extends": [
            "react-app",
            "react-app/jest"
        ]
    },
    "browserslist": {
        "production": [
            ">0.2%",
            "not dead",
            "not op_mini all"
        ],
        "development": [
            "last 1 chrome version",
            "last 1 firefox version",
            "last 1 safari version"
        ]
    }
}

尽管如此,部署还是因缺少构建目录而失败。我已经在前端运行了 npm run build,并且构建文件夹是在本地创建的。如何确保 Vercel 在部署期间使用正确的输出目录?

reactjs deployment vercel
1个回答
0
投票

我有同样的问题,我修改了 vercel.json 文件更改了“builds”,

    "config": {
      "distDir": "build"
    }

还有“路线”,

  {
    "src": "/(.*)",
    "dest": "/frontend/$1"
  }

祝你好运!!!

© www.soinside.com 2019 - 2024. All rights reserved.