Приложение React-router, развернутое в разных местах (подкаталогах)

Question

У меня есть приложение реакции-маршрутизатора, которое я должен развернуть в разных местах (подкаталогах), поэтому базовое имя изменится. Например, он должен иметь следующие пути:

/ (производство)
/appname/env1
/appname/env2

Я хочу использовать историю браузеров, поэтому я реализовал BrowserRouter из реагирующего маршрутизатора, но не могу передать ему статическое базовое имя. И очевидно, что маршрутизация не будет работать, например, если я не передам базовое имя BrowserRouter, если маршрут моей домашней страницы:

<Route path="/" exact component={MyComponent} />

не будет работать при доступе к /appname/env1 или /appname/env2.

Есть ли способ добиться того, что я ищу, с помощью реакции-роутера?

Answer 1

вы можете передать базовое имя, как показано ниже

import { Router, Route, IndexRoute, browserHistory } from 'react-router';
import { useBasename } from 'history'
<Router history={useBasename(() => browserHistory)({ basename: BASENAME })}>

и вы можете установить базовое имя, возможно, в конфигурации вашего веб-пакета

 plugins: [
    new webpack.DefinePlugin({
      BASENAME: JSON.stringify("/appname/env1/")
    }),