Hacking JSX pragma for fun and profit
summary
JSX pragma is repurposed into a global middleware that replaces the compiler’s element factory (Babel/SWC/TypeScript output) with a custom function that intercepts args, logs them, and can mutate props before returning react.createElement. Examples include classNames/CX injected globally to turn className objects into strings, CSS prop mapped to emotion to auto-wrap styling, and Zod runtime prop validation that throws on mismatch (caught by an error boundary). Works but adds runtime overhead and onboarding cost.
AI-written summary · about








