Why MobX might work for vite dev and not vite build production

[StephenHaney]

Documenting for future searchers:

• A lot of us are using @vitejs/plugin-react-swc which doesn't support ES decorators yet, so we've been using tsDecorators: true
• @vitejs/plugin-react-swc only runs in vite dev, it's not used for build
• This plugin -requires- you to use TS decorators since it will error if you try to use @ without tsDecorators: true
• ESBuild now shipped ES spec decorators and will use ES decorators if you target es2022
• MobX doesn't warn about missing accessor words in production (as far as I can tell)

So you can very easily run into a situation where you're using legacy decorators for dev mode and ES decorators for production builds. And your production build won't warn about needing to update your MobX syntax to use accessor. So your prod build might just mysteriously have no observables, although it was working fine in dev!

My solution is to switch to @vitejs/plugin-react (not SWC) so that I can run ES decorators in both dev and prod.

I hope this post saves someone else some debugging time! This is the first time that vite taking different paths for dev and build has bit me.