Vue.js SEO 友好

Posted 2023-02-23

【中文标题】Vue.js SEO 友好

【英文标题】：Vue.js SEO friendly

【发布时间】：2020-04-12 00:02:52

【问题描述】：

让已开发的 Vue 应用程序对 SEO 友好（搜索引擎可读的所有标题元标记）的最简单方法是什么。

我研究了 NUXT，我将不得不重新构建整个东西，而且我不太喜欢 NUXT 的工作方式，除了 s-s-r（服务器端渲染）部分。

【问题讨论】：

你在用vue-router吗？

@Jesper 是的，我正在使用 vue-router。 Vue-CLI。而且大部分路线都是动态的。

这能回答你的问题吗？ Change Meta Title and Description using Vue.js

【参考方案1】：

由于您使用的是vue-router，因此您可以在路径上使用meta 属性：https://router.vuejs.org/guide/advanced/meta.html

从这里开始，您可以定义标题、描述等，然后使用以下语法在布局中使用它们this.$router.currentRoute.meta.title

【讨论】：

我试试

【参考方案2】：

您可以使用vue-meta，在页面中呈现的每个组件上创建自定义元标记（用于 SEO）。