reactjs - 在 netlify 中捕获 create-react-app 的所有重定向

Question

我使用 create-react-app 构建并托管在 netlify 中。

在此link有人提到我需要为 SPA 编写重定向规则。

/*    /index.html   200

但是重定向到 index.html 不起作用，因为没有使用该 URL 呈现 View 。我还尝试重定向到 / 就像

[[redirects]]
  from = "/*"
  to = "/"

但这也不起作用。

如何对 create-react-app 进行全面重定向？

Answer 1

要捕获所有重定向，请在 _redirects 文件中使用 /*/index.html 200 。

根据 netlify 文档，_redirects 文件应该位于您的根构建目录中。

create-react-app 默认情况下会在名为 build 的文件夹下创建所有构建文件

因此，只需修改 package.json 中的build script，即可在构建应用程序后将 _redirects 添加到构建文件夹中。

示例。

"scripts": {
  ....
  "build": "react-scripts build && echo '/* /index.html  200' | cat >build/_redirects ",
  ...
}

如果您有多个重定向，为了让事情变得更容易，您可以创建一个 _redirects 文件，其中包含 CRA 根 (/) 文件夹中的所有重定向

那么在package.json中就会变成

"scripts": {
  ....
  "build": "react-scripts build && cp _redirects build/_redirects",
  ...
}

确保 netlify 中的构建命令是 yarn run build 或 npm run build

在 package.json 中进行更改后，只需重建代码即可。

更新:更好的方法

在CRA(创建React应用程序)中，构建脚本将公共(public)目录中的每个文件复制到构建文件夹中，因此只需将带有规则的_redirects放入公共(public)目录中，无需更改任何内容，就可以了走吧。