VSCode: auto import not working

[dhmoon91]

Hi - I was looking for way to easily integrate shdcn with turbo and ran by your repo.

Looks like auto import from vscode isn't working to reference the @ui.

Also how would I import my own components under components/?

eg:

apps/
packages/
  ui/
    components
      /ui
        Button.tsx
      MyComp1.tsx
  MyComp2.tsx

How could I import MyComp1.tsx or MyComp2.tsx? Looks like nextjs.json for tsconfig is set to alias ../../packages/ui/components/ui/*

[hasanaktas]

Did you find any solution? It is annoying to write each import manually.

[Mill1995]

@dhmoon91

apps/web
packages/ 
  ui/
    components
      /ui
        Button.tsx
      MyComp1.tsx
  MyComp2.tsx

I was able to do this by configuring the tsconfig.json inside the apps/web tsconfig, by setting these values:

 "paths": {
      "@/*": ["./*"],
      "@ui/*": ["../../packages/ui/*"],
      "@ui/components/ui/*": ["../../packages/ui/components/ui/*"]
    },

With the settings above your import statements should resolve to the correct path alias:

import { MyComp1 } from "@ui/components/ui/Button"

or

import { MyComp2 } from "@ui/components/MyComp2"

[dan5py]

@dhmoon91 if you the import to behave like that you need to edit your tsconfig/nextjs.json, like this:

"paths": {
      "@/*": ["./*"],
      "@ui/*": ["../../packages/ui/*"],
-     "@ui/components/*": ["../../packages/ui/components/ui/*"],
      "@ui/components/ui/*": ["../../packages/ui/components/ui/*"]
    }

You should be able to import all your components. Regarding the VSCode auto-import, I'm still working on a fix.

[dan5py]

This should be fixed with the new release 1.1.0 (2bc1a8c0fb0cec07994b86bab66cd78c8d8bb3b6)

[RudiPersson]

I am using 1.1.0. An the vscode autoimport is still not working for me.

[dan5py]

Hi @RudiPersson, could you please try this https://github.com/dan5py/turborepo-shadcn-ui/issues/17#issuecomment-2021476024

[RudiPersson]

@dan5py this fixed it for me :). Thanks for making this 👏