I've been working on integrating TailwindCSS with a React-on-Rails application. While attempting to set up TailwindCSS for styling, I encountered issues with file recognition and the use of TailwindCSS directives in SCSS modules.
Details:
TailwindCSS Configuration: Initially tried to configure tailwindcss-rails for use within the application. However, it seems that .tailwind.scss files are not being properly recognized or processed.
Integration with Yarn: Managed to partially resolve the issue by incorporating TailwindCSS through a Yarn package. This approach allowed for basic TailwindCSS functionality but did not fully address the problem.
SCSS Module Issue: Despite the workaround, I am facing a specific issue where the @apply directive from TailwindCSS is not recognized within SCSS module files. This occurs in the following path:/app/javascript/bundles/components/home.module.scss.
Expected Behavior:
The expected behavior is for TailwindCSS to be integrated with React-on-Rails or just a integratuon for using .(sc|sa)ss, allowing for the use of TailwindCSS classes and directives (@apply) within .scss or .modules.{(sc|sa|c)ss}' files without any issues.
Hi, this gem is not intended to be used with anything node related. In that case, you must install Tailwind on your own using the corresponding NPM packages.
Environment:
Framework/Library Versions: React-on-Rails, tailwindcss-rails Yarn Version:1.22.21 Rails Version: 7.1.3
Issue:
I've been working on integrating TailwindCSS with a React-on-Rails application. While attempting to set up TailwindCSS for styling, I encountered issues with file recognition and the use of TailwindCSS directives in SCSS modules.
Details:
TailwindCSS Configuration: Initially tried to configure
tailwindcss-rails
for use within the application. However, it seems that.tailwind.scss
files are not being properly recognized or processed. Integration with Yarn: Managed to partially resolve the issue by incorporating TailwindCSS through a Yarn package. This approach allowed for basic TailwindCSS functionality but did not fully address the problem. SCSS Module Issue: Despite the workaround, I am facing a specific issue where the@apply
directive from TailwindCSS is not recognized within SCSS module files. This occurs in the following path:/app/javascript/bundles/components/home.module.scss
.Expected Behavior:
The expected behavior is for TailwindCSS to be integrated with React-on-Rails or just a integratuon for using
.(sc|sa)ss
, allowing for the use of TailwindCSS classes and directives (@apply) within.scss
or.modules.{(sc|sa|c)ss}'
files without any issues.PostCSS configuration
TailwindCSS configuration