search

awssat / tailwindo

🔌 Convert Bootstrap CSS code to Tailwind CSS code
MIT License
1.09k stars 108 forks source link

Add support for React JSX #37

Closed ulken closed 3 years ago

ulken commented 3 years ago

Adds support for React JSX(/TSX) by (optionally) looking for className (not only class).

ulken commented 3 years ago

@abdumu Thoughts?

I've used this locally and while it's not 100% perfect it works for most cases. It doesn't handle cases where not a plain quotation is used, but rather a helper function to generate classes, but that's expected/fine, I'd say.

abdumu commented 3 years ago

Thank you for adding this.

Could you add at least one test?

ulken commented 3 years ago

Sure, I'll give it a try.

I found the test suite rather sparse, which is why I didn't add one to begin with.

ulken commented 3 years ago

Any plans of supporting 2.0? Either for this or tailshift.

ulken commented 3 years ago

On a related note: to be framework agnostic, have you considered simply using a regex similar to what PurgeCSS does out-of-the-box?

/[^<>"'`\s]*[^<>"'`\s:]/g

To quote Tailwind CSS:

This basically matches any string separated by spaces, quotes or angle brackets, including HTML tags, attributes, classes, and even the actual written content in your markup.

ulken commented 3 years ago

@abdumu Test added

abdumu commented 3 years ago

thanks