create-react-app - Vercel 重定向中的环境变量

Question

我想将我的 create-react-app 部署到 Vercel。

我在我的 now.json 中定义我的重定向，如下所示:

{
   "redirects": [
      { "source": "/api/(.*)", "destination": "BACKEND_URL/$1", "statusCode": 200 }
   ]
}

目标 URL 取决于在 Vercel 仪表板中定义的环境变量 BACKEND_URL。

我正在尝试在以下构建命令中替换重定向中的环境变量:sed -i "s|BACKEND_URL|${BACKEND_URL}|g"now.json && yarn 构建

但不幸的是 now.json 在构建时似乎不可用:

09:54:44.243 sed: can't read now.json: No such file or directory

如何在 Vercel 中启用动态重定向？

Answer 1

这是不可能的，因为读取 now.json 以确定如何构建，因此您不能在构建期间动态生成它。

相反，请考虑使用类似 Next.js 的框架它提供了一个可以读取 RFC 9081 中定义的环境变量的 next.config.js .

npm install next@canary react react-dom

// next.config.js
module.exports = {
  experimental: {
    async redirects() {
      return [{
        source: "/api/:path*",
        destination: `${process.env.BACKEND_URL}/:path*`,
        permanent: false,
      }]
    }
  }
};

https://github.com/zeit/now/discussions/4351