背景： 由于子域名有限，我们需要将不同的前端项目进行二级目录区分。

一、项目

现有三个项目：
bsrm-web-manage
bsrm-web-operator
bsrm-web-testingorganization

二、期望访问路径

http://bsrm.life.com/bsrm-web-manage
http://bsrm.life.com/bsrm-web-operator
http://bsrm.life.com/bsrm-web-testingorganization

三、React 配置

1. webpack.default.js

添加publicPath

output: {// ...publicPath: process.env.NODE_ENV === "development" ? '/' : '/bsrm-web-manage'
},

output: {// ...publicPath: process.env.NODE_ENV === "development" ? '/' : '/bsrm-web-operator'
},

output: {// ...publicPath: process.env.NODE_ENV === "development" ? '/' : '/bsrm-web-testingorganization'
},

2. index.jsx

<BrowserRouter>标签中，添加 basename

export default function App(){ return (<ConfigProvider locale={zhCN}><BrowserRouter basename={process.env.NODE_ENV === "development" ? '' : '/bsrm-web-manage/'}><RoutesWrapper routes={baseRoutes}/></BrowserRouter></ConfigProvider>)
}

export default function App(){ return (<ConfigProvider locale={zhCN}><BrowserRouter basename={process.env.NODE_ENV === "development" ? '' : '/bsrm-web-operator/'}><RoutesWrapper routes={baseRoutes}/></BrowserRouter></ConfigProvider>)
}

export default function App(){ return (<ConfigProvider locale={zhCN}><BrowserRouter basename={process.env.NODE_ENV === "development" ? '' : '/bsrm-web-testingorganization/'}><RoutesWrapper routes={baseRoutes}/></BrowserRouter></ConfigProvider>)
}

四、Nginx配置

location /bsrm-web-manage/ {alias /var/www/dev/fe/bsrm-web-manage/dist/;try_files $uri /bsrm-web-manage/index.html:
}

location /bsrm-web-operator/ {alias /var/www/dev/fe/bsrm-web-operator/dist/;try_files $uri /bsrm-web-operator/index.html:
}

location /bsrm-web-testingorganization/ {alias /var/www/dev/fe/bsrm-web-testingoraanization/dist/;try_files $uri /bsrm-web-testingorganization/index.html:
}