dan5py / turborepo-shadcn-ui

Turborepo starter with shadcn/ui pre-configured.
MIT License
466 stars 89 forks source link

Turborepo using npm #2

Closed matheralvs closed 1 year ago

matheralvs commented 1 year ago

I'm following your monorepo template for using shadcn-ui but using npm (workspaces). However, the application has continuous import errors, in specific for the component, as well as not responding the default shadcn styling after export. It is possible to provide a template for such a package manager or other alternative?

Ps. I wanted to use npm because my team uses such a manager and it would be easier to standardize the resources.

dan5py commented 1 year ago

Hi @matheralvs, I created a branch that uses npm as package manager. Hope it works as intended. Check it out here.

matheralvs commented 1 year ago

Perfect @dan5py, everything worked fine here, however it got to the point I wanted to discuss, I usually use a src folder to allocate my development files (contexts, functions, constants and etc) in next projects, however I saw that in the next projects package tsconfig next, you passed a path like:

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

What happens is that in my web app, I always try to import using an alias like @/, it always references the ui package and not the src of the folder I'm using, send a screenshot to illustrate:

image

However, placing an alias in the tsconfig of the web app, referencing the web folder, as in:

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

The ui package is no longer able to read your index.tsx imports. I think this was the error that popped up for me every time I tried to adapt your template using npm.

dan5py commented 1 year ago

Thank you for the descriptive explanation! I just updated the template. Now by default you can use the "@/" alias that references the relative app folder. Remember to add the baseUrl: "." to the tsconfig.json if you add any other app.

p.s. the ui package now uses the `@ui/" alias.

matheralvs commented 1 year ago

Perfect @dan5py, it worked perfectly fine here. However I can't apply tailwind styles itself, as in:

image

dan5py commented 1 year ago

That's really strange. Have you removed the import for globals.css from layout.tsx by any chance?

I tried your same code and it works just fine: image

matheralvs commented 1 year ago

That's really strange. Have you removed the import for globals.css from layout.tsx by any chance?

No no, I just pulled the updates you made and tried to apply those styles, however it didn't apply.

dan5py commented 1 year ago

Have you tried restarting the server?

matheralvs commented 1 year ago

Have you tried restarting the server?

Hey bro, I got it here, restarted the app, cleared the cache and it's working again. Before hand @dan5py thank you very much for your attention and feedback, this repo will be very useful for me and my team, improvements or suggestions, I'll come back here and open an issue.

Ps.: What a great job you are doing on shadcn-ui, I'm a huge fan of the library, thanks for making it the perfection it is today. 😁

dan5py commented 1 year ago

Thank you so much, I really appreciate it.