Clarifying Path Alias Configuration in shadcn integration: Preventing the creation of a physical ./# directory

[ngja]

Description

Hi TanStack team,

Following the recent changes in PR #384 which introduced the # prefix as the default path alias for TanStack Start projects, I’ve noticed a common point of confusion that leads to a broken project structure.

When a user adds shadcn components using the CLI, if the components.json is pre-configured with #/components but the tsconfig.json does not yet have a matching path alias, the shadcn CLI interprets # as a literal directory name. This results in the creation of a physical ./# folder at the project root (e.g., ./#/components/ui/...), which is clearly not the intended behavior.

The Issue

To ensure a seamless developer experience and prevent this "literal folder" issue, I believe the configuration needs to be synchronized more explicitly.

Proposed Suggestion

I suggest we provide or enforce one of the following two approaches during the setup or in the documentation:

1. Ensure #/* mapping in tsconfig.json: If we move forward with the # alias as the new standard, the TanStack CLI should ensure (or guide the user to add) the following mapping in tsconfig.json:

JSON
"compilerOptions": {
  "paths": {
    "#/*": ["./src/*"] 
  }
}

This ensures that # is recognized as a path alias and files are correctly placed inside the src directory.

2. Maintain @ as the default in components.json: Alternatively, keeping @ as the default alias for shadcn components (mapping to @/*: ["./src/*"]) would maintain consistency with the existing shadcn/ui ecosystem and prevent the accidental creation of the ./# folder for users migrating from other frameworks.