Merge pull request #108 from ipfs/feat/vuepress-plugin-og

feat: build vuepress-plugin-og

src/.vuepress/config.js

@@ -239,6 +239,7 @@ module.exports = {
           $page.lastUpdated && new Date($page.lastUpdated).toISOString(),
       },
     ],
+    [require('./plugins/vuepress-plugin-og-image')],
     ['vuepress-plugin-robots', { host: CANONICAL_BASE }],
     [
       '@vuepress/html-redirect',

src/.vuepress/plugins/vuepress-plugin-og-image/index.js

@@ -0,0 +1,6 @@
+const path = require('path')
+
+module.exports = {
+  name: 'vuepress-plugin-og-image',
+  clientRootMixin: path.resolve(__dirname, 'pageMeta-mixin.js'),
+}

src/.vuepress/plugins/vuepress-plugin-og-image/pageMeta-mixin.js

@@ -0,0 +1,23 @@
+const { normalize } = require('path')
+
+export default {
+  created() {
+    if (typeof this.$ssrContext !== 'undefined') {
+      const meta = this.$frontmatter.meta
+      const og = meta && meta.find((m) => m.property === 'og:image')
+      if (meta && og) {
+        try {
+          const assetPath = normalize(og.content).replace(/^\/|\/$/g, '')
+          const imgPath = require('@source/assets/' + assetPath)
+          const { pageMeta } = this.$ssrContext
+          this.$ssrContext.pageMeta = pageMeta.replace(
+            new RegExp(og.content, 'g'),
+            imgPath
+          )
+        } catch (e) {
+          throw new Error(`could not load og:image ${og.content}`)
+        }
+      }
+    }
+  },
+}