Compatibility with Astro framework

[pReya]

Compatibility with Astro framework

[rektdeckard]

Thanks @pReya for flagging, and @adamtaylor13 for the fix and for the lovely writeup! v2.0.10 had been published with the type field added.

[adamtaylor13]

@pReya I'm running into this as well. I took a look at your example, and it only actually seems to show the error once I added Smiley to the IconContainer—simply importing it did not seem to reproduce. I'm very curious what changed as well, because the legacy phosphor-react library worked fine with Astro.

Things I've tried

• Switching all imported instances of my react components to "client:only" directives so they aren't server-side rendered.
• Adding "use client" to my icon imports.
• Changing my package.json to "type": "module", to no avail.
• Adding "module": "nodenext", to my tsconfig.json
• All the above in various orders / combinations.

All to no avail unfortunately. I'm going to just have to downgrade to using phosphor-react for right now.

[pReya]

A workaround for me is currently to use the raw svg files and import them with https://github.com/pd4d10/vite-plugin-svgr as React components.

This problem might be fixed just by adding type: "module" to the package.json of the @phosphor-icons/react package.

[adamtaylor13]

This problem might be fixed just by adding type: "module" to the package.json of the @phosphor-icons/react package

@pReya Wow, no kidding, this fixed it!

[adamtaylor13]

Just in case my PR doesn't go through, I wrote a small blog post about how I'm implementing this for now without needing to use the vite plugin: https://adamtaylor.me/posts/fixing-a-minor-inconvenience-with-phosphor-icons/