From b1d8d610bd41eeb60ba5dabb9ff3caf145296daf Mon Sep 17 00:00:00 2001 From: Ted Conn Date: Mon, 30 Mar 2026 17:08:41 +0200 Subject: [PATCH] updating routing skill --- skills/generating-webapp-ui/SKILL.md | 10 ++++++++++ 1 file changed, 10 insertions(+) diff --git a/skills/generating-webapp-ui/SKILL.md b/skills/generating-webapp-ui/SKILL.md index 2efbeeb..6a2798c 100644 --- a/skills/generating-webapp-ui/SKILL.md +++ b/skills/generating-webapp-ui/SKILL.md @@ -43,6 +43,16 @@ Before finishing, confirm: Did I update `appLayout.tsx` with real nav items and Use a single router package. With `createBrowserRouter` / `RouterProvider`, all imports must come from `react-router` (not `react-router-dom`). +If the app uses a client-side router (React Router, Remix Router, Vue Router, etc.), always derive basename / basepath / base from the document's tag at runtime. Never hardcode the basename: + +​```js +const basename = document.querySelector('base') + ? new URL(document.querySelector('base').href).pathname.replace(/\/$/, '') + : '/'; + +const router = createBrowserRouter(routes, { basename }); +​``` + ### Component Library and Styling - **shadcn/ui** for components: `import { Button } from '@/components/ui/button';`