Transient rendering errors after switching to Vite with 2.7.2, cannot read properties of null

[caprica]

I am trying the new Vite integration with 2.7.2, and it is mostly working great.

I do however notice some transient glitches that impact the developer experience a bit.

I'm using the Vite + Express official template, with a reasonably complex project.

For example, after starting the server and opening localhost:3000, after an initial delay it renders the page. Navigating to a new page causes Vite to reoptimize dependencies and while doing so I see a transient error in the browser, always complaining with something like "cannot read properties of null (reading 'useState')" or useMemo or some other hook. After a very short period, that goes away by itself and the page refreshes to the expected contents.

Other times, I click a link to navigate to a new page, I see activity in the server console log that Vite is reoptimizing dependencies, and the current page refreshes when it is done, it does not navigate where I clicked until I click the link again.

After a little while and some page navigations, everything appears to go smoothly.

Is this normal? Is there anything I can do to get rid of these glitches?

This is just one example:

[mclarammd]

I'm facing the same issue

[caprica]

Maybe look at #8917 , there are some comments in there that have a solution that improved the situation for me.

It's still not working perfectly, there are still glitches occasionally, but it's much better. It's at least usable now whereas before it was awful.

[mclarammd]

Thanks, @caprica ! Adding some dependencies in optimizeDeps seem to have solved the issue for me 😄