prismicio / prismic-next

Helpers to integrate Prismic into Next.js apps
https://prismic.io/docs/technologies/nextjs
Apache License 2.0
57 stars 7 forks source link

Make Prismic Preview work with `next export` #30

Open signorbusi opened 2 years ago

signorbusi commented 2 years ago

Is your feature request related to a problem? Please describe.

When using the <PrismicPreview /> component in a NextJS application, the application can no longer be exported using next export. This is due to the usage of NextJS' <Image /> component inside the <PrismicPreview /> component. Next's image component is not compatible with exporting, see: https://nextjs.org/docs/messages/export-image-api

Describe the solution you'd like

Maybe a possible solution would be to allow passing a custom image loader to the PrismicPreview component, or even better just a simple boolean prop to opt-out of the image optimization.

Describe alternatives you've considered

Additional context

Versions used:

@prismicio/next@^0.1.3 next@^12.1.5

The error message of nextjs when exporting an application that uses <PrismicPreview />:

# next export
# ... build logs

Error: Image Optimization using Next.js' default loader is not compatible with `next export`.
  Possible solutions:
    - Use `next start` to run a server, which includes the Image Optimization API.
    - Use any provider which supports Image Optimization (like Vercel).
    - Configure a third-party loader in `next.config.js`.
    - Use the `loader` prop for `next/image`.
  Read more: https://nextjs.org/docs/messages/export-image-api
    at /Users/rvoellmy/nobank/frontend/node_modules/next/dist/export/index.js:156:23
    at async Span.traceAsyncFn (/Users/rvoellmy/nobank/frontend/node_modules/next/dist/trace/trace.js:79:20)
github-actions[bot] commented 2 years ago

This issue has been labeled as a feature request since it was created using the 🙋‍♀️ Feature Request Template.

Hi there, thank you so much for your request!

Following our Maintenance Process, we will review your request and get back to you soon. If we decide to implement it, will proceed to implement the feature during the last week of the month. In the meantime, feel free to provide any details to help us better understand your request, such as:

If you think you can implement the proposed change yourself, you're more than welcome to open a pull request implementing the new feature. Check out our quick start guide for a simple contribution process. Please note that submitting a pull request does not guarantee the feature will be merged.

- The Prismic Open-Source Team