I recently had to integrate shadcn/ui in a monorepo and the default setup of tailwind doesn't quite work.
Happily, it was actually very quick to make small changes in order to make the component collection work as a package in a monorepo.
I think this would be a welcome addition that is very easy to implement and would make building reusable component packages based on this project much simpler.
I'm opening this as a feature request and not a PR as I'm not familiar with how the CLI generates the template files and I'm sure there are subtleties I'm ignoring in my own implementation.
Changes to autogenerated files
split tailwind.config.ts to config + preset
The new config file:
(resetting the content to avoid TS errors, don't think it's required)
import type { Config } from 'tailwindcss'
import preset from './tailwind.preset'
const config: Config = {
content: preset.content,
presets: [preset],
}
export default config
The co-located preset file:
(note the fixed paths, TW doesn't resolve relative paths in presets)
import type { Config } from 'tailwindcss'
import preset from '@this/ui/tailwind-preset'
const config: Config = {
// this is required, content does carry over from presets automatically
content: [...(preset.content as string[]), './src/**/*.{js,ts,jsx,tsx}'],
presets: [preset],
}
In a next.js layout.tsx:
import '@/styles/globals.css' // current project's styles
import '@this/ui/styles.css' // contains only the generated globals.css
Affected component/components
No response
Additional Context
No response
Before submitting
[X] I've made research efforts and searched the documentation
This issue has been automatically closed because it received no activity for a while. If you think it was closed by accident, please leave a comment. Thank you.
Feature description
I recently had to integrate
shadcn/ui
in a monorepo and the default setup of tailwind doesn't quite work.Happily, it was actually very quick to make small changes in order to make the component collection work as a package in a monorepo. I think this would be a welcome addition that is very easy to implement and would make building reusable component packages based on this project much simpler.
I'm opening this as a feature request and not a PR as I'm not familiar with how the CLI generates the template files and I'm sure there are subtleties I'm ignoring in my own implementation.
Changes to autogenerated files
split
tailwind.config.ts
toconfig
+preset
The new config file: (resetting the content to avoid TS errors, don't think it's required)
The co-located preset file: (note the fixed paths, TW doesn't resolve relative paths in presets)
Use in a project
In a next.js
layout.tsx
:Affected component/components
No response
Additional Context
No response
Before submitting