search

joeattardi / picmo

JavaScript emoji picker. Any app, any framework.
https://picmojs.com
MIT License
1.19k stars 117 forks source link

Not ESM/CJS conventional #193

Closed Olyno closed 2 years ago

Olyno commented 2 years ago

Hi 👋🏻 It looks like Picmo packages are not conventional:

@picmo/renderer-twemoji doesn't appear to be written in CJS, but also doesn't appear to be a valid ES module (i.e. it doesn't have "type": "module" or an .mjs extension for the entry point). Please contact the package author to fix. picmo doesn't appear to be written in CJS, but also doesn't appear to be a valid ES module (i.e. it doesn't have "type": "module" or an .mjs extension for the entry point). Please contact the package author to fix.

(i got the same warning with other packages from Picmo's project)

Would it be to fix it please?

joeattardi commented 2 years ago

Thanks for finding this! The bundling/packaging is still a little weird with the beta version, I intend to resolve all that before the final release.

Can you let me know which bundler or tool gave you this message? Or better yet a small example to reproduce it? With that I should be able to resolve the issue. Thanks!

Olyno commented 2 years ago

I'm using a Svelte kit project. I guess for the reproduction, installing the module is enough (it's how it happened in my case). Svelte kit is based on Vite, so it wouldn't surprise me if there is the same warning with Vite

joeattardi commented 2 years ago

I was able to reproduce this with a skeleton SvelteKit project, thanks!

joeattardi commented 2 years ago

Really odd... I got this error when I first created the SvelteKit project. After that I fixed it, but when I reverted my changes I didn't see the error anymore. Even creating a new project from scratch no longer showed the error. Not sure why!

At any rate, I added "type": "module" to the package.json for all three packages.

Can you try the new beta version (run npm install picmo@beta) - should be 5.0.0-beta.10, let me know if the issue goes away for you now? It should be gone since it is now properly flagged as an ES module.

I'll leave the issue open; if the new version fixes this for you, feel free to close. Thanks!

PS: I also was able to discover another issue by trying it in SvelteKit. The main PicMo module had some side effects; that is, it was calling some functions on window and document as soon as the library was imported. This was causing errors since SvelteKit is rendering on the server.

That should be all set now, you will need to wrap the createPicker call in the browser check but the import itself should no longer cause issues.

Olyno commented 2 years ago

It looks like i don't have the warning anymore, thank you!