如何在 Vercel 上通过节点运行构建而不在 URL 中使用“/api”？

Question

我正在尝试在 vercel 上部署我的 React 应用程序。但我想使用节点服务器运行我的构建。 因为我必须在我的节点应用程序中使用 prerender.io。 这样，当有人共享链接时，预览就可以具有动态价值。

为此，我在根文件夹中添加 server.js，这是代码：

const express = require('express');
const prerender = require('prerender-node');

const app = express();

// Serve the static React build files
app.use(express.static('build'));

// Use prerender.io for prerendering
app.use(prerender.set('prerenderToken', 'MY TOKEN'));

// Serve the React app for all routes
app.get('*', (req, res) => {
  res.sendFile(path.resolve(__dirname, 'build', 'index.html'));
});

// Start the server
const port = process.env.PORT || 3000;
app.listen(port, () => {
  console.log(`Server running on port ${port}`);
});

这是我的 vercel.json :

{
    "rewrites": [
      { "source": "/(.*)", "destination": "/server.js" }
    ]
  }
  

但是我的构建没有通过节点读取，我认为 vercel 只是直接为构建提供服务。

但是当我在我的应用程序中添加 api 文件夹并在那里添加相同的 server.js 代码时，之后它开始通过节点应用程序运行。我不想在我的网址中使用“/api”来让它工作。 那么我可以做什么来让我的构建通过节点应用程序运行。

这些是我的 package.json 中的脚本

 "scripts": {
    "start": "node server.js",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject"
  },```

Answer 1

您的 vercel 配置文件格式错误

重写更改从源到目的地的路径， 但请记住，vercel 内部路线是不同的。

在此示例中，您的 api 位于“/api/server”下 那么你需要指向该路径

在你的 vercel.json 中需要更改为这个

{
  "version": 2,
  "rewrites": [{ "source": "/(.*)", "destination": "/api/server" }]
}