naver/egjs-grid

MasonryGrid is undefined

saltyandsmiling opened this issue · 2 comments

Description

Hey y'all. The issue I'm experiencing is that on first render MasonryGrid comes through undefined causing my app to crash. I've fixed the issue by adding a {Boolean(MasonryGrid) && ...(<MasonryGrid>.... where I'm using the library but that seems odd. I'm putting this here to see if anyone else is experiencing the issue or if this is a known problem.

Warning: React.createElement: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: undefined. You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.

Steps to check or reproduce

I'm just importing MasonryGrid into my react component and using it with "gap" and "column" props.

So it looks like this was a SSR issue and inside of a React/Next setup I have to make sure this code is ran on the clientside using the following code.

const [mounted, setMounted] = useState(false);
useEffect(() => { setMounted(true); }, []);

then in the render

{mounted && ( <MasonryGrid gap={16} column={2}> {children} </MasonryGrid>

@saltyandsmiling

Sorry. it's commonjs issue.

Try @egjs/react-grid@1.5.1-beta.0 (@beta) Thank you :)