Quando o aplicativo de várias páginas vite atualizar a página, ele não estará na rota atual, mas retornará à rota raiz

Quando usamos o vite para desenvolver aplicativos de várias páginas

Se houver uma rota em outra página, teremos um problema ao atualizar a página

vite não possui um método serverFallback semelhante ao webpack

por exemplo:

Quando visitamos /nested/ da certo, vai para o projeto /nested

Quando visitamos rotas como /nested/getInfo/xx, descobrimos que, ao atualizar a página, a página retornará ao projeto raiz em vez do projeto atual

Não enviamos rollback de caminho estático de configuração, minha solução atual é:

plugins: [
    {
      name: "rewrite-middleware",
      configureServer(serve) {
        serve.middlewares.use((req, res, next) => {
          if (req.url.startsWith("/nested/")) {
            if (req.url.includes("src")) {
              req.url = req.url
            } else {
              req.url = "/nested/"
            }
          }
          next()
        })
      },
    }
]

Adicione um plug-in para forçar o caminho para o projeto /nested/ 

Mas o problema é que ele tem recursos estáticos, como includes('src') que escrevi, e se ele tiver vários recursos estáticos?

Não posso julgar se é roteamento ou recursos estáticos. Escrevi um problema e continuarei acompanhando para resolver esse problema e encontrar a melhor solução

O acima é a minha solução pessoal

=======================================

A equipe oficial me deu algumas sugestões. A melhor solução agora é encapsulá-lo em uma função (o melhor método que posso imaginar)

Eu encapsulei meu plugin em uma função que pode receber parâmetros, então pelo menos parece muito bom de usar

const rewritePlugin = (path, excludes) => ({
  name: "rewrite-middleware",
  configureServer(serve) {
    serve.middlewares.use((req, res, next) => {
      if (req.url.startsWith(path)) {
        const isRaw = excludes.some((dir) => req.url.includes(dir))
        if (!isRaw) req.url = path
      }
      next()
    })
  },
})

// 第二个参数，看你的项目中有哪些文件夹，都写上就可以了
plugins: [
  rewritePlugin('/nested/', ['/nested/src', '/nested/static'])
]