So verwenden Sie Hooks wie Uselocation mit @react-router/fs-routes
Posted: 10 Apr 2025, 07:07
Ich habe eine React-App mit React-Router / NX / VITE. Wenn ich das Projekt eingerichtet habe, wähle ich SSR: True und jetzt habe ich die folgende < /p>
Ordner (zum Exempl der Standard-_index.ts ) verwende ich einen haken wie uselocation oder usenaViat meine app funktioniert nicht und kehre einen Fehler zurück. Komponent.>
Code: Select all
react-router.config.ts
Code: Select all
import type { Config } from "@react-router/dev/config";
export default {
ssr: true,
} satisfies Config;
< /code>
routes.tsx
Code: Select all
import { type RouteConfig } from "@react-router/dev/routes";
import { flatRoutes } from "@react-router/fs-routes";
export default flatRoutes() satisfies RouteConfig;
< /code>
root.tsx
Code: Select all
import {
Links,
Meta,
Outlet,
Scripts,
ScrollRestoration,
type MetaFunction,
type LinksFunction,
} from 'react-router';
import '../styles.css';
import EntryCommon from './entry.common';
export const meta: MetaFunction = () => [
{
title: 'New Nx React Router App',
},
];
export const links: LinksFunction = () => [
{ 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=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap',
},
];
export function Layout({ children }: { children: React.ReactNode }) {
return (
{children}
);
}
export default function App() {
return ;
}
< /code>
Now, the issue I face is, when, inside a route in my apps/routes/