Vue-meta workaround - Githubissues

karlos1337 commented 5 years ago

Since server.js is embedded in the plugin, are there any other way to configure vue-meta(https://github.com/declandewet/vue-meta) or know about other simple workaround to use dynamic metatags?

zickat commented 5 years ago

I think you can do like my response in #34 :) If you find a good way to do it, I'm very interested !

karlos1337 commented 5 years ago

Didn't works for me @zickat, seems like the plugin info is setted into context but not populated with each component meta info, anyway your answer is very appreciated, thanks :)

zickat commented 5 years ago

If you find a way to do it, I'm very interested 😀

karlos1337 commented 5 years ago

@zickat Sure, I'm still on it and will let you know but maybe I'll try to do from from scratch (https://vuejs.org/v2/guide/ssr.html) , since I can't wait so longer and can't find an easy solution

PureDizzi commented 5 years ago

I am appending the meta tags to this.$ssrContext.meta in serverPrefetch() for now. Then {{{ meta }}} in the html template. It's pretty sad but it works.

tomphilpotts commented 4 years ago

Has anyone had any luck using vue-meta?

I've just spent 3 days sorting out SSR to find out that the reason I did it (SEO - meta tags) does not work!

Any help would be great!

tarasbilohan commented 4 years ago

@BoldAnchor

I'm using a custom version of this plugin (based on v0.5.0).

I am adding to the entry-server.js file context.meta = app.$meta()

import createApp from '@/main'

export default (context) => {
  return new Promise(async (resolve, reject) => {
    const {
      app,
      router,
      store
    } = await createApp({
      host: context.req.get('host')
    })

    router.onReady(() => {
      if (!router.getMatchedComponents().length) {
        context.httpCode = 404
      }

      context.rendered = () => {
        context.state = store.state

        if (store.state.app.httpCode !== null) {
          context.httpCode = store.state.app.httpCode
        }
      }

      context.meta = app.$meta()

      resolve(app)
    }, reject)
  })
}

And here is my index.html

<!DOCTYPE html>
<html lang="en">
<head>
  {{{ meta.inject().title.text() }}}
  {{{ meta.inject().meta.text() }}}
  {{{ meta.inject().link.text() }}}
  {{{ renderResourceHints() }}}
  {{{ renderStyles() }}}
</head>
<body>
  <!--vue-ssr-outlet-->
  {{{ renderState() }}}
  {{{ renderScripts() }}}
</body>
</html>

Akryum / vue-cli-plugin-ssr

Vue-meta workaround #33