dan5py/turborepo-shadcn-ui

UI that imports other UI in package causes causes error I found a solution

Closed this issue · 6 comments

bernardstein commented

so if you use a component like toast or form that imports another ui element it cant find it when building change the @ui/: [./src/] to @repo/ui/: [./src/]

bernardstein commented

also change the import alias to "aliases": {
"components": "@repo/ui/components",
"utils": "@repo/ui/lib/utils"
}

bernardstein commented

that way when adding a component like form or toast it creates the import like import { Label } from "@repo/ui/components/ui/label"; and import { cn } from "@repo/ui/lib/utils";

bernardstein commented

in the ui's package.json my exports are: "exports": {
"./components/": [
"./src/components/.ts",
"./src/components/.tsx"
],
"./lib/": "./src/lib/*.ts",
"./globals.css": "./src/globals.css",
"./tailwind.config": "./tailwind.config.ts",
"./postcss.config": "./postcss.config.js"
}
}

fkysly commented

packages/ui/src/components/ui/*:

  • replace @ui/components/ui to ../ui
  • replace @ui/lib to ../../lib

packages/ui/component.json:

"aliases": {
    "components": "../components",
    "utils": "../../lib/utils"
  }
dan5py commented

@fkysly that would be good but it doesn't work. The CLI requires valid ts aliases and absolute/relative paths throw an error.

dan5py commented

Should work fine now, thanks @bernardstein

  • 👍1