nuxt-og-image
Nuxt OG Imageを使用すると、Vueコンポーネントまたはページのスクリーンショットを使用して、OG画像を簡単に生成できます。
OG画像は、ソーシャルメディアでのクリック率を向上させることが知られています。
Open Graphを初めて使用しますか?このモジュールが必要な理由の詳細については、Open Graphタグをマスターするガイドをご確認ください。
| 私のスポンサープログラム💖によって実現しました 私をフォローしてください@harlan_zw 🐦 • ヘルプはDiscordに参加してください |
機能
- ✨ 組み込みテンプレートを使用するか、Vueコンポーネントで独自の
og:imageを作成 - 🎨 Nuxt DevToolsのOG Image Playgroundで、完全なHMRを使用して
og:imageをデザインおよびテスト - ▲ Satoriを使用してレンダリング:Tailwind / UnoCSSとテーマ、Googleフォント、6種類の絵文字ファミリーなどをサポート!
- 🤖 またはブラウザを使用してプリレンダリング:複雑なテンプレートを簡単にサポート
- 📸 面倒くさいですか?すべてのページでスクリーンショットを生成するだけ:要素を非表示にしたり、アニメーションを待ったりなど
- ⚙️ エッジで動作:Vercel Edge、Netlify Edge、Cloudflare Workers
インストール
プロジェクトにnuxt-og-imageの依存関係をインストールします
npx nuxi@latest module add og-image
ドキュメント
詳細については、📖 完全なドキュメントをお読みください。
デモ
スポンサー
ライセンス
MITライセンスに基づいてライセンスされています。