带有 Nuxt 的 Vuex 中的项目是否被爬取？答案

【问题标题】：Are items in Vuex with Nuxt being crawled?带有 Nuxt 的 Vuex 中的项目是否被爬取？
【发布时间】：2021-02-03 12:55:24
【问题描述】：

我计划将我博客的大部分文本存储在 vuex 中，以加快加载速度。这是一个好主意，特别是对于 SEO 还是我应该为所有帖子创建单独的路线？在我主要使用香草 javascript 之前，我肯定对 SEO 不太了解，而且我也是 vue/nuxt 的新手。

【问题讨论】：

对于 seo 是的，对于速度和可维护性 meh。 nuxt 提供了一个模块来在将被预渲染的静态页面上写博客。 nuxtjs.org/blog/creating-blog-with-nuxt-content 我也在我的博客 blogxon.com 上使用了相同的 nuxt 模块，效果很好

【解决方案1】：

我不会使用 VueX 来存储博客文章，尤其是在您使用所有静态内容的情况下。

Nuxt 有一个很棒的包，nuxt content 就是为此而设计的。它使用降价页面来发布博客文章。

然后我会使用nuxt seo package 来为您网站的搜索引擎优化充电。有了它，您可以轻松设置默认站点 SEO 设置，例如 Twitter 句柄和图像。然后，您可以更新您拥有的每篇博文的社交媒体图片，直接从 nuxt content 获取数据。

【讨论】：

【解决方案2】：

你可以，但绝对不建议这样做。

也适用于静态网站。它们被预渲染。

【讨论】：

感谢您的资源！与在 Vuex 中保存一般信息以及在自己的 Componenet 中保存每个特定帖子相比，将信息保存在 API 中究竟有什么好处。对不起，如果这个问题看起来很基础，网络开发绝对是我最大的弱点^^
@jonithani123 好吧，如果你将它保存在 vuex 商店中，比如假设 10 个博客，并且eath 博客中至少有 1000 个单词，那么你的用户将始终将所有 10 个单词一起加载，一段时间后会非常慢。 vuex 是为 UI 状态而设计的，比如切换侧边栏，或者保存一些信息，比如网络令牌，而不是博客文章。它们通常保存在数据库中或类似 nuxt 模块中，它们在构建过程中被预渲染。
@jonithani123 也提出了一个问题：如果你想要一些大胆的东西怎么办？或者你想要一个 h2 或 h3 标签？或者如果您想在博客文章中添加链接和图片怎么办？仅使用 vuex 将很难。使用 nuxt-content 模块，您有一个 markdown editor 女巫将您的文本转换为 html 元素
是的，你是对的，使用 API 也有助于轻松扩展博客，我为此使用了 vue 来最大程度地减少以后的工作量，以后使用 markdown 将特别容易。非常感谢您的意见！

【解决方案3】：

如果您想知道 Google 是否能够查看内容，我不会担心。我已经测试了许多类似的情况，即使通过外部 API 提取数据，Google 也很乐意等待一段时间，看看页面是如何呈现和抓取结果的。

但是，如果您担心，只需使用 asyncData 或 fetch 生成组件数据。两者都将在您的模板呈现之前运行，因此您可以获取数据并在页面加载之前使其可用。

export default {
  async asyncData({ store }) {
    return {
      blogData: store.state.blogs.find(blog => blog.id === 1)
    }
  }
}

【讨论】：