Use Next image optimization for docs template covers

[caorushizi]

Summary

• switch docs deployment config back to Vercel's managed Next.js runtime
• replace template cover tags with a shared next/image wrapper
• keep docs pages statically prerendered while enabling Vercel image optimization

Verification

• pnpm docs:build
• verified local next/image route returns optimized WebP output

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Actions	Updated (UTC)
one-cli-docs	Ready	Preview, Comment	May 17, 2026 3:02pm

[Copilot]

Pull request overview

Switches the docs site from static export to Vercel's managed Next.js runtime so that next/image optimization can be used for template cover images, and introduces a small wrapper component to centralize the image configuration.

Changes:

• Remove output: "export" / images.unoptimized from next.config.mjs and add outputFileTracingRoot; set framework: "nextjs" in both vercel.json files and drop the explicit outputDirectory.
• Add TemplateCoverImage, a thin wrapper around next/image with fill plus required sizes.
• Replace raw <img> tags for example covers in the listing and detail components with TemplateCoverImage, adding a relative aspect-[16/10] parent on the detail hero so fill works.

Reviewed changes

Copilot reviewed 6 out of 6 changed files in this pull request and generated no comments.

Show a summary per file

File	Description
vercel.json	Switch framework to nextjs and drop static outputDirectory.
apps/docs/vercel.json	Same framework/output change for the docs-scoped config.
apps/docs/next.config.mjs	Remove static export + image-unoptimized settings; add outputFileTracingRoot for the monorepo.
apps/docs/src/components/template-cover-image.tsx	New next/image wrapper using fill and forced sizes.
apps/docs/src/components/template-examples-list.tsx	Use TemplateCoverImage for example cards with responsive sizes.
apps/docs/src/components/template-example-detail.tsx	Use TemplateCoverImage for the hero (with priority) and related cards; add relative aspect-[16/10] wrapper.

---

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.