search

banthagroup / fslightbox-react

Basic version of Fullscreen Lightbox for React.js. Website: https://fslightbox.com/react
MIT License
169 stars 23 forks source link

Getting Element type is invalid on prod build using vite #226

Open af-arturoramirez opened 1 year ago

af-arturoramirez commented 1 year ago

When I run it locally (vite) it works as expected but once I deployed it to prod (using vercel) it is throwing this error:

Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: object.

<button type="button" onClick={() => setToggler(!toggler)}> Toggle Lightbox </button> <FsLightbox toggler={toggler} sources={[ "https://i.imgur.com/fsyrScY.jpg", "https://www.youtube.com/watch?v=3nQNiWdeH2Q", "https://commondatastorage.googleapis.com/gtv-videos-bucket/sample/BigBuckBunny.mp4", ]} />

ydainna commented 1 year ago

Hi! I have the same problem .... if someone managed to fix it and the solution it would be very cool thanks

JasperDeLanghe commented 1 year ago

Running into the same issue when using build scripts. I'm suspecting it's to do with newer react versions, personally I'm on v18.0.0 where the issue is happening.

andriibieriezhnoi commented 1 year ago

as temporary fix for vite

import ReactFsLightbox from 'fslightbox-react';

const FsLightbox = ReactFsLightbox.default
  ? ReactFsLightbox.default
  : ReactFsLightbox;

then use <FsLightbox />

madsongr commented 1 year ago

as temporary fix for vite

import ReactFsLightbox from 'fslightbox-react';

const FsLightbox = ReactFsLightbox.default
  ? ReactFsLightbox.default
  : ReactFsLightbox;

then use <FsLightbox />

Hi, I tried using and it works but I get this message on vscode and when I try to build it:

Property 'default' does not exist on type 'typeof FsLightbox'.

What can I do now?