turborepo-shadcn-ui icon indicating copy to clipboard operation
turborepo-shadcn-ui copied to clipboard

Try to support Vite application and shared shadcn/ui components.

Open evgenius1424 opened this issue 1 year ago • 5 comments

I've added vite and copied some boilerplate. But it fails with

../../packages/ui/src/components/ui/button.tsx:5:20 - error TS2307: Cannot find module '@ui/lib/utils' or its corresponding type declarations.

5 import { cn } from "@ui/lib/utils";

If you have any ideas on how to fix it, please add comments to the review.

evgenius1424 avatar Feb 12 '24 22:02 evgenius1424

Hello @dan5py, I really appreciate your help with Vite support and shared components. I wanted to start some monorepo but the shadcn-ui components only worked as a local setup.

Thanks for unblocking me and possibly others.

It works great.

image

evgenius1424 avatar Feb 21 '24 11:02 evgenius1424

Hi @dan5py, are you planning to merge it? I think it would be a really great update for this repo to show that even different projects can share shadcn/ui components.

evgenius1424 avatar Feb 29 '24 19:02 evgenius1424

+1 to this PR by @evgenius1424. I was trying to implement this template on a Turborepo project with a React.js + Vite app and I used this PR as a reference for solving the runtime issues I had when importing @ui/lib/utils (mentioned in #20).

I would just like to add though that the tsconfig.json within any Vite app should contain a path that points to the ui package itself.

"compilerOptions": {
  "paths": {
    "@ui/*": ["../../packages/ui/src/*"]
  }
}

This will also solve issues where the editor may complain about not being able to find the modules being imported.

starkfire avatar Mar 18 '24 22:03 starkfire

Thank you both @evgenius1424 and @starkfire . Your combined solution works like a charm!

magoz avatar Mar 22 '24 12:03 magoz

Hi @dan5py, are you planning to merge it? I think it would be a really great update for this repo to show that even different projects can share shadcn/ui components.

@evgenius1424, actually I like the idea of having a clean repo with a single app as boilerplate. But yeah, this would help people with a different setup. I could create a simple docs website for it. I'll see what I can do.

dan5py avatar Mar 22 '24 18:03 dan5py

Okay, I think there are projects that use turborepo with vite only. Or do some sort of migration.

If we support two major players (VIte and Next) and point out that sharing works perfectly between them, it makes a lot of sense.

rm -rf apps/vite is all you need to continue working with next only.

But yeah, it's up to you.

evgenius1424 avatar May 23 '24 16:05 evgenius1424