The example shown in readme (solid-start section) does not work out of the box. It shows error tags array should be passed to <MetaProvider /> in node, however there is no suitable example mentioned in the docs about what the tags array expects.
// @refresh reload
import { MetaProvider, Title } from "@solidjs/meta";
import { Router } from "@solidjs/router";
import { FileRoutes } from "@solidjs/start";
import { Suspense } from "solid-js";
import "./app.css";
export default function App() {
return (
<Router
root={props => (
<MetaProvider>
<Title>SolidStart - Basic</Title>
<a href="/">Index</a>
<a href="/about">About</a>
<Suspense>{props.children}</Suspense>
</MetaProvider>
)}
>
<FileRoutes />
</Router>
);
}
I tried the following code
import './app.css';
import { Router } from '@solidjs/router';
import { FileRoutes } from '@solidjs/start/router';
import { Suspense } from 'solid-js';
import Nav from '~/components/Nav';
import { MetaProvider, Title } from '@solidjs/meta';
export default function App() {
return (
<Router
root={(props) => (
<MetaProvider tags={[{ id: 'hello', tag: 'title', props: { children: 'my page' } }]}>
<Nav />
<Suspense>{props.children}</Suspense>
<Title>my page</Title>
</MetaProvider>
)}
>
<FileRoutes />
</Router>
);
}
In doing so the error is gone but it does not render anything on the SSR output. The tag prop is not properly typed so I am not sure if I am passing the correct value. I think some more details are missing in the documentation.
Also what does On the server, the tags are collected, and then on the client the server-generated tags are removed in favor of the client-rendered tags so that SPAs still work as expected (e.g. in cases where subsequent page loads need to change the head tags). this mean? I assume it must render something in the SSR output initially and then modifies those on the client?
The example shown in readme (solid-start section) does not work out of the box. It shows error
tags array should be passed to <MetaProvider /> in node
, however there is no suitable example mentioned in the docs about what the tags array expects.I tried the following code
In doing so the error is gone but it does not render anything on the SSR output. The tag prop is not properly typed so I am not sure if I am passing the correct value. I think some more details are missing in the documentation.
Also what does
On the server, the tags are collected, and then on the client the server-generated tags are removed in favor of the client-rendered tags so that SPAs still work as expected (e.g. in cases where subsequent page loads need to change the head tags).
this mean? I assume it must render something in the SSR output initially and then modifies those on the client?