This content originally appeared on DEV Community and was authored by Catherine Chen
Here's a quick and easy guide on how to setup TailwindCSS, using the SASS preprocessor, in a new RedwoodJS project.
Requirements
Make sure you have the correct npm / yarn versions installed, the details of which can be found at https://redwoodjs.com/docs/quick-start.
Setting up tailwind and scss
yarn create redwood-app my-app-name
cd my-app-name
yarn rw setup ui tailwind
yarn rw setup webpack
yarn workspace web add -D sass sass-loader
The code above will create a new RedwoodJS project, then set up Tailwind, webpack, and Sass in your project.
Make sure to change index.css to index.scss and update the import in your web/src/App.js file.
Conclusion
That should be it! You're now all set to go :)
This content originally appeared on DEV Community and was authored by Catherine Chen
Catherine Chen | Sciencx (2022-03-26T00:51:04+00:00) Setting up TailwindCSS with SASS in RedwoodJS. Retrieved from https://www.scien.cx/2022/03/26/setting-up-tailwindcss-with-sass-in-redwoodjs/
Please log in to upload a file.
There are no updates yet.
Click the Upload button above to add an update.