I had a plain CSS file that would apply a theme to my Nuxt 3 project, but I chose to convert to SASS so that I can make use of variables and nesting so that future changes (such as theme colors, etc) can be made easily. In addition, I wanted to integrate this with TailwindCSS until I realised that PostCSS is the way to go for that.
I've spent many hours of turning that plain CSS into multi-file SASS and now I'm desperate of converting that into PostCSS so that I can make use of Tailwind directives and functions in all files which would then be fed into the Nuxt 3 project.
Is there any way I can do this migration easily and preferably keeping the nesting and variables still there (possibly the ability to half-compile SASS)?
Instead of configuring PostCSS heavily by installing and configuring multiple plugins, I was able to make use of Tailwind using tailwindcss/nesting
(to keep the ability to have nested styles) and theme()
utilities they provide (for variables, therefore also configuring theme
option in tailwind.config.js
).