docs: fix TS error in Node.js runtime local assets example

[EAzZY-1wnL]

What?

Updated the documentation for opengraph-image / twitter-image to fix the Node.js runtime with local assets example.

Why?

The existing snippet did not type-check cleanly with Next.js 15+ and could confuse developers.
This update improves developer experience by ensuring the snippet is immediately usable and accurate.

How?

• Reproduced the example in a fresh Next.js 15+ project.
• Updated the docs example to:
  • Use readFile + Base64 encoding instead of invalid file URLs.
  • Clarify that assets should be placed relative to the project root.
• Added an entry to Version History noting the update in v15.x.

Checklist

• Ran pnpm prettier-fix
• Verified formatting & linting (pnpm build && pnpm lint)
• Documentation guidelines followed
• Example verified in a real Next.js 15 project

Fixes #75583 & #75625 (if considered same class of issue)

[ijjk]

Allow CI Workflow Run

• approve CI run for commit: 365e002

Note: this should only be enabled once the PR is ready to go and can only be enabled by a maintainer

[ijjk]

Allow CI Workflow Run

• approve CI run for commit: 0dd5bc9

Note: this should only be enabled once the PR is ready to go and can only be enabled by a maintainer

[icyJoseph]

Right, I tried to address several months ago haha #75628 - let me do a memory refresh

[EAzZY-1wnL]

Hi @icyJoseph just following up, whenever you get a chance, could you please review this PR? I saw your earlier comment about #75628, so I think you’re familiar with the context. Thanks a lot for your time!

[EAzZY-1wnL]

Hi @ijjk @samcx @icyJoseph

Since this is my first contribution to Next.js, I’m not fully sure about the next steps, how PRs typically get reviewed, and whether I should tag someone specific or just wait for it to get picked up.

Could you please guide me on the best way to proceed and how reviews are usually requested in this repo?

Thanks a lot!

[icyJoseph]

So I kind of disagree with this PR, at least in its current form.

The problem here is because:

• TS is, in a way, all or nothing, the moment you extend a type it is extended for all
• satori does indeed support ArrayBuffer, Type 'ArrayBuffer' is not assignable to type 'string'. when using local image. satori#606 (comment)

Satori is the engine used under the hood. The idea with supporting ArrayBuffer is a DX advantage.

The way I see it, we should perhaps combine this PR and my PR, to show explicitly a use case using base64 that doesn't need any TypeScript handling, and my PR that shows ArrayBuffer, with a @ts-expect-error directive.

Also, I think your PR can be shortened with:

  const logoData = await readFile(join(process.cwd(), 'logo.png'), 'base64')
  const logoSrc = `data:image/png;base64,${logoData}`

Something like that ~

Do you mind cherry-picking or re-applying the PR I linked above, and have the two snippets? Let's see how it looks like.

[EAzZY-1wnL]

Hi @icyJoseph sure will add both 😊

[EAzZY-1wnL]

Hey @icyJoseph,
I’ve pushed the fixes for the Open Graph image handling, both A) Base64 (TypeScript-friendly, recommended) and B) Satori inline asset example are included, with notes in the docs for clarity. Could you take a look and let me know if this aligns with what you had in mind?