search

callstack / linaria

Zero-runtime CSS in JS library
https://linaria.dev
MIT License
11.59k stars 416 forks source link

React Native support #236

Open ai opened 5 years ago

ai commented 5 years ago

Do you want to request a feature or report a bug?

feature

What is the expected behavior?

One of the biggest reason to use styled-components is RN support.

It definitely, should be some CSS→RN loader for webpack. We need only show some example in the docs.

satya164 commented 5 years ago

For RN, a Babel plugin should be enough. I can work on it soon.

ai commented 5 years ago

Here is a useful thing https://github.com/styled-components/css-to-react-native

satya164 commented 5 years ago

thank you!

ferrannp commented 5 years ago

@satya164 was going to open an issue but ok I can just comment here. Let's make this first class cross-platform library :) (without styled components).

deadcoder0904 commented 5 years ago

is it done already? also, any plans of supporting react-native-web after that?

chrisdrackett commented 5 years ago

@deadcoder0904 if react-native is supported react-native-web should "just work" :)

deadcoder0904 commented 5 years ago

that would need some config at least that's what I think.

react-native-elements did it like this, although I'm not sure if it's required here since that's a UI kit & this is different.

hemedani commented 4 years ago

any news about this feature

jayu commented 4 years ago

I was thinking about possible implementations and I got stuck. Taking the effort to ship react-native support would make sense for me if we could write cross-platform styles for the components. However, I don't see any good way of providing this kind of support.

Assuming that linaria currently supports CSS syntax and set of selectors, we cannot map every web selector to react-native. We could support some basic cases, but we cannot make our CSS styles works in 100% in react-native. So resuing existing linaria styles in react-native would rather not work in most of the projects. We could create new components with a limited set of CSS rules that would work in both environments. But we will lose the flexibility of web styling. A way of doing that would be to make styled from linaria/react work in react-native by returning a component with styles that are created in runtime. I'm not sure if using babel, in this case, gives us any benefit since we could only extract some part of styles to stylesheet (which itself does not give any noticeable performance improvement). Support for dynamic styles would have to be done in runtime anyway.

Another approach would use react-native styling props and support web via react-native-web. But with this approach, we lose the main feature of linaria which is exporting static CSS files. So it looks like there is no place for linaria in this approach, It would be easier to contribute to react-native-web and add support for CSS extraction there.

If we could agree on restrictions from the first approach, it is a way of moving forward.

jayu commented 4 years ago

We want to support react-native but first, we have to decide if

upendra-web commented 2 years ago

Hi team, any update on this? Or did anyone find a workaround for this?

drizzlesconsin commented 2 years ago

any update?

hyochan commented 1 year ago

Waiting for the update here too 🙂

17Amir17 commented 1 year ago

2023 bump!

Rag0n commented 1 year ago

Another bump :)

Anber commented 1 year ago

While the road to implementing React Native is clear, I personally lack experience in this area. However, if someone is interested in creating and supporting a processor for React Native, I would be more than happy to provide guidance on how to do it :)