vue.js - 我们可以在没有 SSR 的情况下使用 vue-meta 吗?

标签 vue.js seo nuxt.js meta vue-meta

我一直在与 vue-meta npm package 一起工作用于更新我的元标记。但我看到一个问题,我放在里面的值 metaInfo()未在 google 搜索描述中正确呈现。

metaInfo () {
    return {
      title: 'FAQ',
      meta: [
        {name: 'description', content: 'How can we help you?'},
        {property: 'og:title', content: 'How can we help you?'},
        {property: 'og:site_name', content: 'FAQ site'},
        {property: 'og:description', content: 'How can we help you?'}
      ]
    }
  }
如果我们在浏览器中打开 devtools,我们可以看到 DOM 中附加了元标记。所以我们现在有两个描述。
  • 我们放入的元描述 index.html文件。
  • 在 vue-meta 包的帮助下附加在 DOM 中的元描述。

  • 我阅读了很多关于 vue-meta 的文章,但我很难找到不使用 SSR 或 Nuxt 的解决方案,因此我们可以使用 vue-meta不使用SSR。

    最佳答案

    不幸的是,这类问题需要在项目开始时提出(SSR 与否),通常会导致决定使用什么。
    好消息是 Nuxt 与 Vue 没有什么不同。由于它只是 Vue 之上的一个包装器,因此您可以将 90% 的当前应用程序放入其中,它应该可以正常工作(几个月前有人这样做过,并且进展得非常顺利+非常快)。 Nuxt 没有很多缺点,本质上是在 Vue 之上添加了一些不错的东西。
    你也可以试试这个:https://prerender.io/vue-js/ (它确实支持 SPA)
    但是 IMO,您将通过带有 SSR 的 Nuxt 获得更多控制和灵活性(在 staticserver 目标中)。

    关于vue.js - 我们可以在没有 SSR 的情况下使用 vue-meta 吗?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/67609074/

    相关文章:

    node.js - 在 Electron 应用程序中运行时加载 Nodejs 模块

    apache - .htaccess 文件中哪个是正确/更好的规则?

    SEO - 临时未发布的页面 - 要返回哪个 http 状态代码?

    ruby-on-rails - 缓存 friendly_id 插件

    javascript - 导入语句破坏脚本设置 Nuxtjs 3

    vuejs2 - 如何使用 Nuxt.js 将自己的 JS 用作插件

    javascript - VueJS 推送带有参数的路由在浏览器中显示旧参数

    javascript - Laravel-Vuejs : Remove repeated time slots

    vue.js - Vee验证3个提交表单时发现的错误

    javascript - “没有创建 Firebase 应用程序 '[DEFAULT]'”,即使调用了 initializeApp