Make this package work with tools that use ESM

Stanko / react-animate-height

Lightweight React component for animating height using CSS transitions. Slide up/down the element, and animate it to any specific height.

https://muffinman.io/react-animate-height

MIT License

758 stars 53 forks source link

Make this package work with tools that use ESM #73

Closed thesoftwarephilosopher closed 5 years ago

thesoftwarephilosopher commented 5 years ago

In particular, https://www.pika.dev/search?q=react-animate-height/

See https://www.pika.dev/blog/pika-web-a-future-without-webpack/ for more details

Stanko commented 5 years ago

Thank you, I'll release it to npm right away!

thesoftwarephilosopher commented 5 years ago

Great thanks @Stanko 👍

Stanko commented 5 years ago

react-animate-height@2.0.10 is released 🎉

thesoftwarephilosopher commented 5 years ago

Hmm I wonder why https://www.pika.dev/search?q=react-animate-height/ isn't updated to show that your library works great now. I bet it has a cache, I wonder how to force it as a user for a specific package, if possible... @FredKSchott, any ideas?

FredKSchott commented 5 years ago

We fetch from Cloudflare's mirror of npm (allows CORs requests), but it looks like they're just doing some caching on the response. I'd just give it a second.

See: https://npmjs.cf/

FredKSchott commented 5 years ago

Following up: looks the npm cache has been updated, but one of its dependencies is broken: https://unpkg.com/react-animate-height@2.0.10/ (source/index.js doesn't actually exist in the package)

Stanko commented 5 years ago

Should be fine now. source folder was in .npmignore

https://unpkg.com/react-animate-height@2.0.13/source/

Cheers!

EDIT: Then there was a compilation error, as your setup wasn't expecting jsx in js files. Then I changed extension to jsx, but rollup wasn't able to resolve import which is not js. Now I changed import to import AnimateHeight from './AnimateHeight.jsx' and hopefully that will work.

EDIT2: I had to revert these changes as those broke the build https://github.com/Stanko/react-animate-height/issues/75

I'm willing to help package get released on pika, but I'll need help with your build system. It would be wonderful if you can test it locally and submit a PR.

thesoftwarephilosopher commented 5 years ago

Oh yeah I didn't consider that Pika might not know what to do with the JSX during Rollup phase... Hmm... @FredKSchott thoughts?

FredKSchott commented 5 years ago

Yea, you shouldn’t publish JSX to npm (not standard JS, unclear what framework to connect it to, etc). Sounds like you’ll need to still build your ESM distribution, check out @pika/pack or microbundle

Stanko commented 5 years ago

Correct me I'm wrong, but I think confusion was created by this PR. It changed package.json and added source file which includes jsx files.

"module": "src/index.js"

instead of transpiled version

"module": "lib/index.js"

Especially as I don't release src folder to npm.

You can check file here: https://unpkg.com/react-animate-height@2.0.13/lib/index.js

Is that solution to this one?

@FredKSchott @sdegutis

thesoftwarephilosopher commented 5 years ago

That sounds right to me. Although I don't know of the CJS format will be compatible with the current version of Pika/{CDN,web}, it might require pikapkg/web#62 first.