DeckyVault
Steam Deck Benchmarks & Settings
),
{
...size,
}
)
}
```
- [ ] **Step 2: Verify OG image builds**
Run: `bun run build`
Expected: Build succeeds. `opengraph-image` route appears in build output.
---
### Task 3: Create Twitter Card Image
**Files:**
- Create: `app/twitter-image.tsx`
Shares the same design as the OG image. Next.js supports separate `twitter-image` files. For now, we duplicate the OG image logic to allow independent customization later.
- [ ] **Step 1: Create `app/twitter-image.tsx`**
```tsx
import { ImageResponse } from "next/og"
import { readFile } from "node:fs/promises"
import { join } from "node:path"
export const alt = "DeckyVault - Steam Deck Benchmarks & Settings"
export const size = {
width: 1200,
height: 630,
}
export const contentType = "image/png"
export default async function Image() {
const logoData = await readFile(
join(process.cwd(), "app/icon.png"),
"base64"
)
const logoSrc = `data:image/png;base64,${logoData}`
return new ImageResponse(
(