diff --git a/apps/www/content/docs/installation/tanstack.mdx b/apps/www/content/docs/installation/tanstack.mdx
index a42fcf5d99..0b1d652b01 100644
--- a/apps/www/content/docs/installation/tanstack.mdx
+++ b/apps/www/content/docs/installation/tanstack.mdx
@@ -3,12 +3,6 @@ title: TanStack Start
description: Install and configure shadcn/ui for TanStack Start.
---
-
- **Update:** We have added full support for React 19 and Tailwind v4 in the
- `canary` release. See the docs for [Tailwind v4](/docs/tailwind-v4) for more
- information.
-
-
### Create project
@@ -16,69 +10,10 @@ description: Install and configure shadcn/ui for TanStack Start.
Start by creating a new TanStack Start project:
```bash
-npx create-tsrouter-app@latest my-app --template typescript --tailwind
+npx create-tsrouter-app@latest my-app --template file-router --tailwind --add-ons shadcn
```
-### Edit tsconfig.json file
-
-Add the `baseUrl` and `paths` properties to the `compilerOptions` section of the `tsconfig.json`:
-
-```ts title="tsconfig.json" showLineNumbers {3-6}
-{
- "compilerOptions": {
- "baseUrl": ".",
- "paths": {
- "@/*": ["./src/*"]
- }
- }
-}
-```
-
-### Update vite.config.ts
-
-Add the following code to the `vite.config.ts` file so your app can resolve paths without error:
-
-```bash
-npm install -D @types/node
-```
-
-```typescript title="vite.config.ts" showLineNumbers {18-22}
-import path from "path"
-import tailwindcss from "@tailwindcss/vite"
-import { TanStackRouterVite } from "@tanstack/router-plugin/vite"
-import viteReact from "@vitejs/plugin-react"
-import { defineConfig } from "vite"
-
-// https://vitejs.dev/config/
-export default defineConfig({
- plugins: [
- TanStackRouterVite({ autoCodeSplitting: true }),
- viteReact(),
- tailwindcss(),
- ],
- test: {
- globals: true,
- environment: "jsdom",
- },
- resolve: {
- alias: {
- "@": path.resolve(__dirname, "./src"),
- },
- },
-})
-```
-
-### Run the CLI
-
-Run the `shadcn` init command to setup your project:
-
-```bash
-npx shadcn@canary init -d
-```
-
-This will create a `components.json` file in the root of your project and configure CSS variables inside `src/styles.css`.
-
-### That's it
+### Add Components
You can now start adding components to your project.
@@ -88,7 +23,7 @@ npx shadcn@canary add button
The command above will add the `Button` component to your project. You can then import it like this:
-```tsx title="app/routes/index.tsx" showLineNumbers {3,12}
+```tsx title="src/routes/index.tsx" showLineNumbers {3,12}
import { createFileRoute } from "@tanstack/react-router"
import { Button } from "@/components/ui/button"