Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

NextJS error #1353

Open
fabritw opened this issue Jan 24, 2024 · 1 comment
Open

NextJS error #1353

fabritw opened this issue Jan 24, 2024 · 1 comment

Comments

@fabritw
Copy link

fabritw commented Jan 24, 2024

Describe the bug
Error occurring using App router (NextJS v14)

Failed to generate static paths for /projects/[slug]:
TypeError: (0 , react__WEBPACK_IMPORTED_MODULE_0__.createContext) is not a function
    at eval (webpack-internal:///(rsc)/./node_modules/react-photoswipe-gallery/dist/context.js:7:83)

Code example
// FILE: src/components/Gallery/index.tsx
export { Gallery, Item } from "react-photoswipe-gallery";

// FILE: src/app/posts/[slug/]page.tsx

import { Gallery, Item } from "@/components/Gallery";
...
<Gallery withCaption>
  {post.gallery &&
    post.gallery.map((item, index) => (
      <Item
        key={index}
        original={item.image}
        thumbnail={item.image}
        width={item.width}
        height={item.height}
        caption={item.caption}
      >
        {({ ref, open }) => (
          <Image
            ref={ref}
            onClick={open}
            src={item.image}
            width={100}
            alt={item.caption}
          />
        )}
      </Item>
    ))}
</Gallery>

Attempted Fix
Setting "use client", causes a different error

 Error: Functions cannot be passed directly to Client Components unless you explicitly expose it by marking it with "use server".
  <... original=... thumbnail=... width=... height=... caption=... children={function}>

// FILE: src/components/Gallery/index.tsx

"use client";
export { Gallery, Item } from "react-photoswipe-gallery";

// FILE: src/app/posts/[slug/]page.tsx
... same as above


Any suggestions what could be a solution please?

@akhmadullin
Copy link
Contributor

Hi, can you provide a repo or a sandbox, where this case can be reproduced?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants