[SOLVED] - How to integrate the tailwind-css into Meteor application with SCSS and fourseven:scss Meteor package?

There are existing multiple tutorials, how to integrate tailwind-css into Meteor app with CSS.

But in my case, I’m using SCSS with fourseven:scss Meteor package. How can I successfully integrate the Tailwind into Meteor with SCSS?

The more updated one is from @fredmaiaarantes Meteor.js with React and Tailwind CSS 3 | by Frederico Maia | Meteor Blog
Also, you can create a new app using the CLI and passing the argument meteor create --tailwind

1 Like

Are you asking about integrating Tailwind in an existing Meteor app that is using fourseven:scss?

1 Like

@hschmaiske @alimgafar Thanks a lot for your great help like always :slight_smile: Finally the problem was with the package seba:minifiers-autoprefixer. After remove this package and install back original standard-minifier-css@1.8.1 Tailwind started working.

Greetings.

2 Likes

Hey @klaucode

Trying to integrate Tailwind into my Scss meteor app to rework all my components to use Tailwind.

I’ve followed the tutorials and your tip but still it’s not working.
GitHub - gadicc/meteor-blaze-react-component: <Blaze template="itemsList" items={items} />)

Any tips? Really wanna get into Tailwind - feeling to buy the enterprise package.

Thanks

1 Like

@klaucode

As ever, the forum post is the ultimate rubber duck. Seem to have it up and running!

Thanks

1 Like

Great, if can help to somebody. Good luck with Tailwind, I’m using it and I’m thinking opposite, to remove it :smiley:

Oh really - why is that?

Also did you find a way to only apply tailwind styles to certain files?

…because, when you will be creating design by your mind, Tailwind is great. But If you need to create design 1:1 to Figma, I think, Tailwind is by my experience not so great, because instead of tailwind, I must do a lot of customizations (If I need pixel perfect design 1:1), I must still overriding the Tailwind design and etc. In complicated components, is by my experience to design that components separate instead of searching common parts with whole app or another components to be able to create a common classnames to be able to meet the principes of tailwind.

@0800robin
Split app into components and design components is easier to maintain in my opinion. Also refreshing of Meteor app is faster, because when you putting classes into components, react components must be rebuilded, what is slower, like rebuild css/scss styles.

But It’s based on my experience and somebody else he doesn’t have to agree with me.

Thx & good luck with development :slight_smile: