Migrando de Create React App para Vite sem dor de cabeça no Debugger

Quando trocamos de CRA para Vite, um dos maiores desafios que surge é fazer o debugger do VSCode funcionar corretamente, especialmente com sourcemaps. No meu time, a galera sempre reclama que o debugger não consegue mapear as linhas direito ou fica travando, o que acaba dificultando o desenvolvimento.

No artigo do StackOverflow, eles apontam que o problema está em como o Vite gera esses sourcemaps, que podem não estar compatíveis com o VSCode ou o navegador, causando esse comportamento estranho. A solução que encontrei foi ajustar as configurações do Vite para gerar sourcemaps compatíveis e, em alguns casos, usar plugins específicos para melhorar essa integração. A decisão fica mais saudável quando o time consegue medir o impacto depois.

A migração gradual, com atenção na configuração do build e do dev server, ajuda a evitar esse tipo de dor de cabeça. Além disso, sempre que possível, testei o debug em diferentes navegadores, pois Chrome e Firefox às vezes se comportam de forma diferente nesse cenário. Essa preparação evita que o desenvolvedor perca tempo com ajustes que parecem simples, mas podem travar seu fluxo de trabalho. Sem esse critério, a solução pode parecer simples no começo e cara no suporte. O valor aparece melhor quando operação, produto e engenharia olham para o mesmo risco.

No seu caso, já tentou alguma dessas configurações de sourcemaps no Vite? Ou ainda está na fase de testes?