react-native - expo构建web页面路径

Question

我已经与世博会做了一个项目。

它工作正常，我很高兴，但现在我需要直接访问子页面(例如 https://example.com/backoffice )

在 App.js 中我做了这个:

...
const linking = {
    prefixes: ['https:/example.com'],
    config: {
      screens: {
        Home: '',
        Backoffice: '/backoffice',
      }
    },
  };

  return (
    <NavigationContainer linking={linking}>
...

如果我在开发模式下执行代码并将站点调用:19006 端口，我可以直接访问子页面。

如果我在 expo build:web 和 npxserve web-build 之后执行代码，我将无法访问子页面(我收到 404 not find)。

Answer 1

由于您使用的是服务，因此您需要一个 serve.json 来处理重定向。 Expo 通过 expo build:web 自动生成 serve.json，但它不包含任何重定向代码。您可能可以在 app.json 中添加一个设置来自动生成重定向代码，但我在文档中看不到任何内容。 (希望有人能够在这里启发我)。

假设这是一个带有 index.html 的单页 Web 应用，您需要在构建 Web 应用后在 serve.json 中添加以下内容:

{
  ...
  "rewrites": [
    { "source": "/*", "destination": "/index.html" }
  ]
}

此方法并不理想，因为每次构建 Web 应用程序时都必须执行此操作，但至少它应该允许您在本地运行构建时访问子页面。

例如，如果您要在 Netlify 上部署，则需要添加 _redirects 文件。我将 _redirects 文件放在项目根目录中名为 web 的目录中(即 web/_redirects)。您可以在以下位置找到有关重定向文件的更多信息: Netlify 文档，但文件应如下所示:

/*    /index.html   200

创建此文件后，如果运行 expo build:web，您应该会在 web-build 目录中看到它。这应该允许您在 Netlify 上部署为单页 Web 应用程序。