feat: og

Author: Barbapapazes

.gitignore

@@ -99,6 +99,7 @@ dist/
 .vitepress/dist
 .vitepress/cache
 .vitepress/.temp
+src/public/og
 
 # Serverless directories
 .serverless/

.vitepress/config.ts

@@ -14,6 +14,8 @@ import {
   groupIconMdPlugin,
   groupIconVitePlugin
 } from 'vitepress-plugin-group-icons'
+import { addOgImage } from 'vitepress-plugin-og'
+import { withCtx } from 'vue'
 
 const nav: ThemeConfig['nav'] = [
   {
@@ -610,15 +612,7 @@ export default defineConfigWithTheme<ThemeConfig>({
         content: 'Vue.js - The Progressive JavaScript Framework'
       }
     ],
-    [
-      'meta',
-      {
-        property: 'og:image',
-        content: 'https://vuejs.org/images/logo.png'
-      }
-    ],
     ['meta', { name: 'twitter:site', content: '@vuejs' }],
-    ['meta', { name: 'twitter:card', content: 'summary' }],
     [
       'link',
       {
@@ -759,6 +753,12 @@ export default defineConfigWithTheme<ThemeConfig>({
     }
   },
 
+  async transformPageData(pageData, ctx) {
+      await addOgImage(pageData, ctx, {
+        domain: 'https://vuejs.org',
+      })
+  },
+
   markdown: {
     theme: 'github-dark',
     config(md) {

package.json

@@ -25,6 +25,7 @@
     "typescript": "^5.6.3",
     "vitepress-plugin-group-icons": "^1.5.4",
     "vitepress-plugin-llms": "^0.0.8",
+    "vitepress-plugin-og": "^0.0.3",
     "vue-tsc": "^2.1.6"
   },
   "packageManager": "[email protected]"