Como configurar uma SPA para não quebrar refresh e rotas diretas?

Quando uma SPA usa roteamento do lado do cliente, o navegador pode tentar abrir diretamente uma URL que só faz sentido para o JavaScript da aplicação. Se o servidor não souber disso, ele procura um arquivo físico correspondente e devolve 404. É por isso que o projeto parece funcionar navegando internamente, mas quebra no refresh ou ao abrir um link direto.

A solução é configurar fallback para index.html, preservando ao mesmo tempo os arquivos reais do projeto, como CSS, JS, imagens, uploads e endpoints de API. Em Apache isso costuma ficar no .htaccess; em Nginx, na regra de try_files; em hospedagens estáticas, em uma opção específica de rewrite.

O detalhe importante é não transformar tudo em fallback cego. Se a aplicação compartilha domínio com uma API, por exemplo, as rotas do back-end precisam continuar sendo tratadas como back-end. O mesmo vale para diretórios de arquivo real.

Esse é um tipo de ajuste pequeno, mas decisivo. Sem ele, a experiência da SPA fica inconsistente e passa a depender de como o usuário chegou à página. Com ele, as rotas se comportam como parte natural do site, inclusive em acesso direto.