search

atomiks / floating-ui

JavaScript positioning library for tooltips, popovers, dropdowns, and more
https://floating-ui.com
MIT License
1.54k stars 21 forks source link

Can't import the named export 'computePosition' from non EcmaScript module (only default export is available) #2

Closed jessehanley closed 2 years ago

jessehanley commented 2 years ago

Hey there!

Huge fan of Tippy.js so jumped straight in here to see if we could get it to work with our product.

Installed it via yarn just fine, but running into when it compiles: Can't import the named export 'computePosition' from non EcmaScript module (only default export is available)

I'm not so hot with React so was wondering what I'm missing?

atomiks commented 2 years ago

Thanks!

This is caused by the dist module files being .mjs. See here for solutions: https://github.com/framer/motion/issues/1307

atomiks commented 2 years ago

I know that Nuxt 3 requires .mjs files to actually use a library.

I am thinking to prevent interop issues we can use .js files by default for "module" and Nuxt users can import the .mjs file directly...

jessehanley commented 2 years ago

If it's helpful, we're just a standard Rails app using Webpacker. Read through your link + dove into a few other issues and got a little lost so gave up (busy day today) 😅

Might try again laters.

atomiks commented 2 years ago

This fix is now published on npm, it should just workâ„¢ now with any webpack-based bundler like CRA

jessehanley commented 2 years ago

You're awesome, thank you. Got it working and will continue to play. Having some issues getting it to align on a node in a draggable canvas but that's a "me" problem 🥴