Bug: Broken default export with Vite 8 / Rolldown
Description
After upgrading to Vite 8, importing react-countup breaks with the following warning:
Warning: React.jsx: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: object.
Root cause
Vite 8 switched from esbuild/Rollup to Rolldown as its bundler. Rolldown changed the CJS interop behavior: when module.exports.__esModule === true, the default import now resolves to module.exports.default instead of module.exports itself.
Because react-countup ships as CJS with __esModule: true, the default import returns the whole module object instead of the component function:
import CountUp from 'react-countup';
console.log(CountUp);
// → { __esModule: true, default: ƒ CountUp, useCountUp: ƒ }
// Expected: ƒ CountUp
Steps to reproduce
- Use Vite 8 (Rolldown)
- Import
react-countup as default import
- Render
<CountUp /> — React throws the invalid type warning
Current workaround
Adding legacy.inconsistentCjsInterop: true in vite.config.js restores the old behavior, but this option is marked as deprecated.
Expected fix
The package should either:
- Ship an ESM build (
"type": "module" or a proper exports field in package.json)
- Or ensure the CJS bundle is compatible with the new Rolldown interop behavior (i.e. not set
__esModule: true unless the default export is correct)
References
Environment
|
|
| react-countup |
latest |
| Vite |
8.x |
| Rolldown |
(bundled with Vite 8) |
| React |
18 / 19 |
Bug: Broken default export with Vite 8 / Rolldown
Description
After upgrading to Vite 8, importing
react-countupbreaks with the following warning:Root cause
Vite 8 switched from esbuild/Rollup to Rolldown as its bundler. Rolldown changed the CJS interop behavior: when
module.exports.__esModule === true, the default import now resolves tomodule.exports.defaultinstead ofmodule.exportsitself.Because
react-countupships as CJS with__esModule: true, the default import returns the whole module object instead of the component function:Steps to reproduce
react-countupas default import<CountUp />— React throws the invalid type warningCurrent workaround
Adding
legacy.inconsistentCjsInterop: trueinvite.config.jsrestores the old behavior, but this option is marked as deprecated.Expected fix
The package should either:
"type": "module"or a properexportsfield inpackage.json)__esModule: trueunless the default export is correct)References
Environment