Search code examples
javascriptreactjsvitecountdownrollup

Importing 'countdown' module causes error when building React app with Vite

I'm using the 'countdown' module in my React app, which I import like this:

import countdown from 'countdown';

When I run the app in dev mode with Vite, everything works fine. However, when I try to build the app, I get the following error:

RollupError: "default" is not exported by "node_modules/.pnpm/countdown@2.6.0/node_modules/countdown/countdown.js", imported by "src/App.tsx".

I've tried changing the import statement to * as countdown instead, but then I get the following error:

DEFAULTS" is not exported by "node_modules/.pnpm/countdown@2.6.0/node_modules/countdown/countdown.js", imported by "src/App.tsx".
Cannot call a namespace ("countdown").

Here is the MRE

Does anyone know what might be causing these errors and how I can fix them? I'm fairly new to React and Vite, so any help would be appreciated.

Thanks in advance!

Solution

  • Although I'm not particularly fond of this solution, it does work. Essentially, I copied the library code and type declarations (countdown.js and countdown.d.ts), turned countdown.js into an esm module, and made a small edit to countdown.d.ts to export the module.

    let countdown: countdown.CountdownStatic;
export default countdown;

    With these changes, everything runs and builds as expected.