nuxt-og-image
Enlightened runtime images generated with Vue templates, for Nuxt.
Status: v2.1 Released Please report any issues 🐛 Made possible by my Sponsor Program 💖 Follow me @harlan_zw 🐦 • Join Discord for help |
Features
- ✨ Turn your Vue components into
og:image
templates - 🎨 Design them in the OG Image Playground with full HMR
- ▲ Render using Satori: Tailwind classes, Google fonts, emoji support and more!
- 🤖 Or prerender using the Browser: Supporting painless, complex templates
- 📸 Feeling lazy? Just generate screenshots for every page: hide elements, wait for animations, and more
- ⚙️ Works on the edge: Vercel Edge, Netlify Edge and Cloudflare Workers
Installation
- Install
nuxt-og-image
dependency to your project:
#
yarn add -D nuxt-og-image
#
npm install -D nuxt-og-image
#
pnpm i -D nuxt-og-image
- Add it to your
modules
section in yournuxt.config
:
export default defineNuxtConfig({
modules: ['nuxt-og-image']
})
Playgrounds
Documentation
📖 Read the full documentation for more information.
Sponsors
License
MIT License © 2023-PRESENT Harlan Wilton