Reactjs 我可以在我的网站上的两个不同路径上托管相同的react应用程序吗？

我当前的设置

• 我有一个基本的html+css网站。（说）
• 我在上托管了一个react应用程序

为此，我在package.json中设置了

"homepage": "https://example.com/register/"

在我的App.js上

<Router history={history} basename="/register">
</Router>

这是我想做的。我想在url

example.com/pricing

上托管相同的react应用程序

---

我怎样才能做到这一点？我希望代码/逻辑等的重复最少。

一个解决方案是执行两个单独的构建，一个用于

/register

，另一个用于

/pricing

您可以使用环境变量

PUBLIC\u URL

来指定根目录，而不是使用

package.json中的
homepage
字段来指定根目录，并调用
REACT\u APP\u BASENAME
，用于
路由器的
BASENAME
道具

<Router history={history} basename={process.env.REACT_APP_BASENAME}>

这可能不适用于您的特定设置，但react router v5有一个新功能，允许为同一组件使用多个匹配器：

// Instead of this:
<Switch>
  <Route path="/users/:id" component={User} />
  <Route path="/profile/:id" component={User} />
</Switch>

// you can now do this:
<Route path={["/users/:id", "/profile/:id"]} component={User} />

//而不是这个：
//您现在可以执行以下操作：

谢谢你的回答。我知道这一点，但它不会在我的情况下工作，因为我正在使用我现有的网站在不同的位置。
"build:register": "PUBLIC_URL=https://example.com/register/ REACT_APP_BASENAME=/register node scripts/build.js",
"build:pricing": "PUBLIC_URL=https://example.com/pricing/ REACT_APP_BASENAME=/pricing node scripts/build.js"

// Instead of this:
<Switch>
  <Route path="/users/:id" component={User} />
  <Route path="/profile/:id" component={User} />
</Switch>

// you can now do this:
<Route path={["/users/:id", "/profile/:id"]} component={User} />