DEV Community

Cover image for How to share tailwind configuration between nuxt layers
Ismael Garcia
Ismael Garcia

Posted on

How to share tailwind configuration between nuxt layers

While working in the nuxt-layer-monorepo I encounter a issue with the tailwind styles:

  • UI Layer have a tailwind config file and override the default tailwind CSS configurations
  • Then using the UI Layer in the Content layer

Tailwind configurations got reset to the base for some reason, even that the layers' config should be use

So the solution that I found and is currently working is just to create a new tailwind.config.ts in the Content layer

and put the following on it:

import twc from "@local-monorepo/ui/tailwind.config"


export default twc
Enter fullscreen mode Exit fullscreen mode

Basically importing the tailwind config from the UI Layer and using that in the Content layer.

Note

This is working for me, but please if there is a better way kindly let me know.

**Happy hacking!

Working on the audio version

The Loop VueJs Podcast

Top comments (1)

Collapse
 
raajaryan profile image
Deepak Kumar

Hello everyone,

I hope you're all doing well. I recently launched an open-source project called the Ultimate JavaScript Project, and I'd love your support. Please check it out and give it a star on GitHub: Ultimate JavaScript Project. Your support would mean a lot to me and greatly help in the project's growth.

Thank you!