How can I configure base html in Tanstack Start (SolidJS) Application ?
I tried to create this root route:
When I launch the dev server, I get
How can I simply configure a basic html structure for a Tanstack Start (Solid) Application ?
Thx
import { createRootRoute, HeadContent, Outlet } from "@tanstack/solid-router";
import { Scripts } from "@tanstack/solid-start";
export const Route = createRootRoute({
component: RootComponent,
head: () => ({
links: [
{ rel: "preconnect", href: "https://fonts.googleapis.com" },
{
rel: "preconnect",
href: "https://fonts.gstatic.com",
crossOrigin: "anonymous",
},
{
rel: "stylesheet",
href: "https://fonts.googleapis.com/css2?family=Geist+Mono:wght@100..900&family=Geist:wght@100..900&display=swap",
},
],
scripts: [
{
src: "https://analytics.eu.umami.is/script.js",
defer: true,
"data-website-id": "ee09d538-8dab-4134-9dca-aad904b65af7",
},
],
meta: [
{ charset: "utf-8" },
{ name: "viewport", content: "width=device-width, initial-scale=1" },
{ title: "Solid UI" },
],
}),
});
function RootComponent() {
return (
<html lang="en">
<head>
<HeadContent />
</head>
<body>
<Outlet />
<Scripts />
</body>
</html>
);
}import { createRootRoute, HeadContent, Outlet } from "@tanstack/solid-router";
import { Scripts } from "@tanstack/solid-start";
export const Route = createRootRoute({
component: RootComponent,
head: () => ({
links: [
{ rel: "preconnect", href: "https://fonts.googleapis.com" },
{
rel: "preconnect",
href: "https://fonts.gstatic.com",
crossOrigin: "anonymous",
},
{
rel: "stylesheet",
href: "https://fonts.googleapis.com/css2?family=Geist+Mono:wght@100..900&family=Geist:wght@100..900&display=swap",
},
],
scripts: [
{
src: "https://analytics.eu.umami.is/script.js",
defer: true,
"data-website-id": "ee09d538-8dab-4134-9dca-aad904b65af7",
},
],
meta: [
{ charset: "utf-8" },
{ name: "viewport", content: "width=device-width, initial-scale=1" },
{ title: "Solid UI" },
],
}),
});
function RootComponent() {
return (
<html lang="en">
<head>
<HeadContent />
</head>
<body>
<Outlet />
<Scripts />
</body>
</html>
);
}When I launch the dev server, I get
template2 is not a functiontemplate2 is not a function on the browser.How can I simply configure a basic html structure for a Tanstack Start (Solid) Application ?
Thx