tsparticles causing build to fail

[lokkeestudios]

I just wanted to let you know, that I had issues with building my Astro website after I added tsparticles to it.

The following is the stack trace of the failed build I get:

node:internal/process/promises:289
            triggerUncaughtException(err, true /* fromPromise */);
            ^

Error: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: object.

Changing the Particles component import from a default, to a regular import did the job (import { Particles } from 'react-particles' instead of import Particles from 'react-particles').

I don't know if this is just an Astro issue, or why your documentation advises one to import Particles as a default import, just wanted to inform you of this issue and it's fix 😃 Cheers!

[matteobruni]

There's a package for Astro here: https://github.com/tsparticles/astro

The default and named exports are both active as can be seen here:

https://github.com/tsparticles/react/blob/b57f938466043e5d7c8924299ff02c8e71190bc6/components/react/src/index.ts#L6-L7

The default import is used because it's the expected behavior in many React packages, it's an Astro issue, but I'd like to move it to the Astro repository since it's something unrelated to React.