react项目和静态页面一起部署，应该如何实现？

我们有个react项目，还有一个同项目的静态首页。

最后打包后的目录结构大致是

dist
    - index.html // 静态页面
    - react // react项目打包页面
    - - index.html
    - - umi.js
    - - layout.js
    - - layout.css

希望访问http://localhost:8081的时候访问index.html，访问http://localhost:8081/react之后的都访问react中的页面。

umi配置文件

export default {
  npmClient: 'pnpm',
  outputPath: 'dist/react',
  copy: [
    {
      from: 'web', // web文件夹里就是index.html 静态页面
      to: 'dist',
    },
  ],
};

dist放到nginx上，配置nginx

server {
        listen       8081;
        server_name  localhost;

        location / {
            root   /demo/dist;
            index  index.html index.htm;
        }
    }

部署后，访问http://localhost:8081可以访问静态首页，但是访问http://localhost:8081/react的时候，react/index.html和react/umi.js都可以正确访问，但是layout.js和layout.css没有访问，导致页面空白。

请问这种需求如何解决？