React Native Support

[kaustubhkagrawal]

Can we use twind with react native. Also if it doesn't support react native right now because I guess that might not be the main focus, can you suggest any workaround or any other package we can use along side twind to make it work in react native.

[mnik01]

+1 Interesting for me

[sastan]

I have never used react native and wouldn't know where to start. This may take some time.

[vicary]

@sastan I don't think I can make a PR, but I'll chip in what I know hopefully it helps with coming up with an idea.

React Native has no concept of classes, neither class nor className is available by default.

Taking reference from Nativewind you may get an idea on how to force a className prop for most of the built-in components. Layout frameworks, e.g. React Native Elements or React Native Paper, is another rabbit hole that we shouldn't get into just yet.

It's about making a babel plugin that transforms class names into inline styles, or React Native StyleSheets. Nativewind uses Tailwind CLI, replacing that part of the babel plugin with Twind should in theory do the job.

Why not Nativewind then?

It is Twind's grouping syntax which really get me into Tailwind, the vanilla syntax is just a maintenance hellhole.

[sastan]

Thank you. That is a good start. I'll take a look.

[chrisarts]

Im doing some work on this and I hope to have a preview for tailwind in react native using twind, but the library mode its a bit confusing and the documentation is missing, if you have some time to talk and share we can sit together.

[stale[bot]]

Hey folks. This issue hasn't received any traction for 90 days, so we're going to close this for housekeeping. If this is still an ongoing issue, please do consider contributing a Pull Request to resolve it. Further discussion is always welcome even with the issue closed. If anything actionable is posted in the comments, we'll consider reopening it. ⓘ