How to render Gridsome metadata (vue-meta) Server Side?

Question

In Gridsome: Seems like what is in metaInfo gets generated after mount, which results in no link preview when scraped by facebook. The og:title, description and image are visible on client side.

How to get it generate on build so it would be in .html straight away?

I've been only able to add global data with head.meta.push({}) in main.js

Answer 1

Solution: move metaInfo into App.vue.

Seems like it only renders App.vue when building and it will only call a metaInfo() in there - where you can use the metadata obj from gridsome.server.js method createPage().