Remix + `@vercel/og`

Small example of using @vercel/og in your Remix app.

remix-og's People

Contributors

Watchers

remix-og's Issues

vercel/og breaks dev build

We've encountered an issue with the vercel/og package breaking our development build.

Steps to reproduce:

Clone this repository.
Run pnpm install.
Execute pnpm dev.

We have a similar setup to this repository (using remix + vercel/og + Vercel edge deployment). When we import vercel/og using the import syntax just like in this repo, our development build stops working.

Error message received:

pnpm dev

> @ dev /User/k9/code/remix-og
> remix dev


 💿  remix dev

 info  building...
 warn  esm-only package: @vercel/og
┃ @vercel/og is possibly an ESM-only package.
┃ To bundle it with your server, include it in `serverDependenciesToBundle`
┃ -> https://remix.run/docs/en/main/file-conventions/remix-config#serverdependenciestobundle
┗
 info  built (2.2s)

/User/k9/code/remix-og/build/index.js:330
var import_og = require("@vercel/og"), import_jsx_dev_runtime5 = require("react/jsx-dev-runtime"), config2 = { runtime: "edge" };
                ^
Error [ERR_REQUIRE_ESM]: require() of ES Module /User/k9/code/remix-og/node_modules/.pnpm/@[email protected]/node_modules/@vercel/og/dist/index.node.js from /User/k9/code/remix-og/build/index.js not supported.
Instead change the require of index.node.js in /User/k9/code/remix-og/build/index.js to a dynamic import() which is available in all CommonJS modules.
    at Object.<anonymous> (/User/k9/code/remix-og/build/index.js:330:17)
    at Object.<anonymous> (/User/k9/code/remix-og/node_modules/.pnpm/@[email protected]/node_modules/@remix-run/serve/dist/cli.js:38:13)