Vite asset import gives a type error on examples or guide

[henriquekirchheck]

Which project does this relate to?

Start

Describe the bug

When using the examples or the guide provided in the TanStack Start documentation to base your own project, the types for asset imports are not defined like it is in a default Vite app.

This can be observed with the app.css import on all examples, where it has to be annotated with // @ts-expect-error.

This can be fixed by adding /// <reference types="vinxi/types/client" /> and /// <reference types="vinxi/types/server" /> to their respective files, like shown in vinxis example.

// app/ssr.tsx
/// <reference types="vinxi/types/server" />
import {
  createStartHandler,
  defaultStreamHandler,
} from "@tanstack/start/server";

// app/client.tsx
/// <reference types="vinxi/types/client" />
import { hydrateRoot } from 'react-dom/client'
import { StartClient } from '@tanstack/start'
import { createRouter } from './router'

Your Example Website or App

https://stackblitz.com/github/tanstack/router/tree/main/examples/react/start-basic

Steps to Reproduce the Bug or Issue

1. Go to app/routes/__root.tsx in the example.
2. Remove the // @ts-expect-error comment from the following snippet:

import { NotFound } from '~/components/NotFound'
// @ts-expect-error
import appCss from '~/styles/app.css?url'
import { seo } from '~/utils/seo'

3. See the type error

Expected behavior

I'd much prefer if this was handled like Vite already does it, where it gives you the correct type for the URL that is passed in.

Screenshots or Videos

Type error on the CSS URL import

Expected behavior after fix:

Platform

This is irrelevant for this problem, as it does not affect the resulting website/api, but I'll include it anyway.

• OS: Windows, Linux
• Browser: Firefox
• Version: 130.0.1

Additional context

No response

[SeanCassiere]

Feel free to open a PR fixing the examples.