Cannot use import statement outside a module

lbianfa commented 3 months ago

Astro Info

Astro                    v4.13.1
Node                     v20.11.0
System                   Windows (x64)
Package Manager          npm
Output                   static
Adapter                  none
Integrations             @astrojs/react

If this issue only occurs in one browser, which browser is a problem?

No response

Describe the Bug

I am trying to implement @splidejs/react-splide in my Astro project, in the following component.

But I am getting the following error.

What's the expected result?

"The successful compilation of the dependency.

Link to Minimal Reproducible Example

https://stackblitz.com/edit/withastro-astro-38yfim?file=src%2Fcomponents%2FSplideTest.jsx

Participation

[ ] I am willing to submit a pull request for this issue.

Princesseuh commented 3 months ago

The package is wrongly made https://publint.dev/@splidejs/react-splide@0.7.12

The ESM exports are being treated as CJS. You may be able to get it working through some of the settings described here: https://vitejs.dev/guide/dep-pre-bundling.html#customizing-the-behavior

PTBYSR commented 3 weeks ago

Have you solved this issue? Because I'm getting the exact same problem

HawtinZeng commented 1 week ago

+1 It's annoying, we can't use ES module in Vue Component???

withastro / astro