小编Rob*_* Bo的帖子

仅在 Vue 或 Nuxt 项目中为 SEO 预渲染某些页面

我正在用 Vue 或 Nuxtjs 规划一个新项目。我想使用 Firebase Auth/functions/storage/firestore 作为后端,因此在 firebase 上托管也很好。我也很想使用 Vuetify。

Landingpage、About、Contact 必须很容易被谷歌索引,但用户登录后的应用程序与 SEO 无关。

我认为预渲染将是最好和最简单的解决方案。所以我测试了一些例子,但没有设法只渲染某些页面。

我使用 prerender-spa-plugin 来选择路由,但在运行 nuxt build 并部署到 firebase 后,所有路由都被预渲染。

Nuxt App 以通用模式运行:

  mode: 'universal',
Run Code Online (Sandbox Code Playgroud)

为了配置 Webpack,我在 nuxt.config.js 中使用了它:

plugins: [
            new HtmlWebpackPlugin({
                template: './public/index.html',
                inject: false
            }),
            new PrerenderSPAPlugin({
                staticDir: path.join(__dirname, './dist'),
                routes: ['/', '/about'],
            })
        ],
Run Code Online (Sandbox Code Playgroud)

部署版本可以在这里找到。

我想,如果我正在运行 nuxt build 并部署 dist 文件夹,则应该只预渲染 / 和 /about,其余的应该像普通的 SPA 一样。

这是构建一个在登陆页面上对 SEO 友好但在用户登录后成为水疗中心的应用程序的方法吗?

seo render prerender vue.js nuxt.js

7
推荐指数
0
解决办法
949
查看次数

标签 统计

nuxt.js ×1

prerender ×1

render ×1

seo ×1

vue.js ×1