I have a React project that uses Deck.gl. The app has been working fine for several weeks, and is in production without issue. However, today, while developing, the app started crashing with these errors in the console:
TypeError: Cannot set properties of undefined (setting 'adapter') at new WebGLAdapter
I rolled back all my changes back, then when that didn't work, I completely deleted the local repo and checked out the working production branch. I cleared all node_modules and re-installed everything using the unchanged yarn.lock file. But no love - I keep getting the same error.
The error occurs on both chrome and safari, but our staging and production versions are running fine in the same browsers.
If I build the project with vite build and run with vite preview, then no problems. But I can't get it to work with the standard vite command (ie. running the dev server).
If I comment out all Deck.gl code, it works. But as soon as I bring a Deck class instantiator back into the code, such as:
...the app crashes again. Even if this code is never called (ie. In a function, but the function call is commented out).
I tried delaying the module loading - eg. const { GoogleMapsOverlay } = await import('@deck.gl/google-maps');. This allows the app to render. But as soon I actually try to use a deck module, it crashes again.
A colleague is working on the exact same codebase without issue.
I have absolutely no idea what has changed in my environment, or how to get it working again???
In case anyone stumbles across this post...
I managed to track down a previous version of the codebase that would run in vite dev mode. Finally, I isolated the change which caused this error. It was changing this line from:
import { GeoJsonLayer } from 'deck.gl';
to
import { GeoJsonLayer } from '@deck.gl/layers';
which introduces the issue, although not immediately. I think it was re-installing dependencies after making this change, which uncovers the error.