This repository was archived by the owner on Oct 1, 2025. It is now read-only.
This repository was archived by the owner on Oct 1, 2025. It is now read-only.
SSR title & metadata into page using Laravel & Vue 3 #721
Description
I'm trying to inject the title and metadata into a blade file so it beomes Server Side Rendered instead of just Client Side updated.
(Short) : i need to only SSR the title & metadata
I'm using Laravel 8.60.0 with Vue 3 (3.2.11) and inertia-vue3
app.js :
import { createApp, h } from "vue";
// Inertia
import { App as InertiaApp, plugin as InertiaPlugin } from "@inertiajs/inertia-vue3";
const app = createApp({
render: () =>
h(InertiaApp, {
initialPage: JSON.parse(el.dataset.page),
resolveComponent: (name) => require(`./App.vue`).default,
}),
});
// vue-meta
import { createMetaManager } from "vue-meta";
app.use(createMetaManager({refreshOnceOnNavigation: true}));
const el = document.getElementById("app");
app.mount(el);
export default app;
App.vue :
<template>
<h1>Hello World!</h1>
</template>
<script>
import { useMeta } from 'vue-meta'
export default {
created() {
useMeta({title: 'My First Page', description: 'This is my first page description.'})
},
};
</script>
app.blade.php :
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0" />
<link href="{{ mix('/css/app.css') }}" rel="stylesheet" />
</head>
<body>
@inertia
<script src="{{ mix('/js/app.js') }}" defer></script>
</body>
</html>
at this stage it's updating the title & metadata but when i view the page source i don't see them because they are Client Side Rendered.
I've tried to implement Inject metadata into page string in docs. like this :
// app.js
const el = document.getElementById("app");
app.mount(el);
app.get('*', (req, res) => {
const context = { url: req.url }
renderer.renderToString(context, (error, html) => {
// etc...
But i get error Uncaught TypeError: app.get is not a function in console.
How can i achieve this if it's possible with the setup i'm doing? i just need to SSR only the title & metadata not the entire page content.