[bug]: Init creates `@` folder instead of alias for /components and /lib/utils.ts

[T04435]

Describe the bug

When using the init command leaving everything with defaults the output of the aliases is a folder @/components/ui @/lib/utils.ts

Instead we should get ~/components/ui ~/lib/utils.ts

Think the issue here: https://github.com/shadcn-ui/ui/blob/7590fb76364c46b72653623b6ee4a96f0ad0bca8/packages/cli/src/commands/init.ts#L327

when @/components/ui and @/lib are provided it creates the @/ folder.

Affected component/components

ALL

How to reproduce

1. pnpm dlx shadcn-ui@latest init
2. All defaults
3. Created folders @/components/ui & @lib/utils

Codesandbox/StackBlitz link

No response

Logs

No response

System Info

macOS: Sonoma 14.4.1 (23E224)

Before submitting

• [X] I've made research efforts and searched the documentation
• [X] I've searched for existing issues

[T04435]

same happens if the path provided is ~/components/ui it creates a folder ~/

[randriamanampisoastone]

I too encountered the same problem. it took me a lot of time.

Did you find a solution?

[ceednee]

+1

[servesh-chaturvedi]

@T04435 could you share your tsconfig.json file?

[kmccrory-grx]

+1000 Here. Im using in a monorepo and having it create these folders on init is really messing with our config. It would also be great if i could separate the install folder from the import alias.

[elijahmontenegro]

I think I might be onto something. I fixed the issue for my situation so hopefully this info helps. I am using a turborepo monorepo, trying to generate shaycn-ui components in a packages/ui project. The issue seems to be with how typescript configurations operate against a baseUrl property.

I was extending packages/configs/typescript/base.json in my packages/ui/tsconfig.json. The configuration was added as a dependency in my project @repo/configs. I was hoping to inherit the setting for "baseUrl": "." that way, but Typescript saw this and used the relative path according to where the template file was located, at least I think so.

The result was a @repo/configs folder getting generated containing the shaycn-ui output, much like you guys reported but with an @ folder being made instead.

To fix it, I took the "baseUrl" property out of my base configuration template and moved it to my project. Upon running npx shadcn-ui@latest init it correctly generated the files in my src folder.

[vasvalstan]

Same issue here, no idea how to get over it...

[LTOpen]

Same issue, I reinit shadcn but the problem still exists. tsconfig.json

{
  "compilerOptions": {
    "composite": true,
    "tsBuildInfoFile": "./node_modules/.tmp/tsconfig.app.tsbuildinfo",
    "target": "ES2020",
    "useDefineForClassFields": true,
    "lib": ["ES2020", "DOM", "DOM.Iterable"],
    "module": "ESNext",
    "skipLibCheck": true,
    "baseUrl": ".",
    "paths": {
      "@/*": [
        "./src/*"
      ]
    },

components.json

{
  "$schema": "https://ui.shadcn.com/schema.json",
  "style": "default",
  "rsc": false,
  "tsx": true,
  "tailwind": {
    "config": "tailwind.config.js",
    "css": "src/index.css",
    "baseColor": "neutral",
    "cssVariables": true,
    "prefix": ""
  },
  "aliases": {
    "components": "@/components",
    "utils": "@/lib/utils"
  }
}

[Ankur1493]

did anyone find the solution to this?

[lukjaki]

Same issue for me :|