search

necolas / react-native-web

Cross-platform React UI packages
https://necolas.github.io/react-native-web
MIT License
21.61k stars 1.79k forks source link

React Native 0.60 tasks #1172

Closed necolas closed 4 years ago

necolas commented 5 years ago

Tasks related to changes in React Native 0.60.

Afterwards:

jstheoriginal commented 5 years ago

Are the update snasphot tasks simply taking the appropriate folder from RN 0.57 and replacing the folder in this project? If not, do you have the steps required for that type of task?

Also, should we work off of RN 0.57.4 tag? https://github.com/facebook/react-native/tree/v0.57.4

necolas commented 5 years ago

Updated the OP. RN 0.57.5. Snapshots are of files, not directories. You'll also need to handle updating any new import paths or dependencies

unindented commented 5 years ago

I'll try to take a look at Replace context.isInAParentText w/ React.createContext, see if it's too big for me.

necolas commented 5 years ago

I accidentally wiped out a bunch of commits on the react-native-0.57 branch because I forgot to pull down changes I pushed from another computer. Need to fix that when I'm back in SF

jamespacileo commented 5 years ago

❤️

steida commented 5 years ago

@jamespacileo Please never do this, use this:

screenshot 2019-01-16 at 22 08 17

Many people were notified for no reason.

Also, do not thank for my comment. You shall express your emotions with the emoticons. Thank you.

jkobject commented 5 years ago

Sorry to ask a stupid question, but what do you mean by updating a snapshot? does it corresponds to jest snapshots Would be happy to help. Thank you,

jkobject commented 5 years ago

Sorry, I wanted to modify it and thought I could, instead of spamming, just comment the initial message of necolas. I did not do it on purpose. I had a simple question, was not able to pinpoint what was asked here and hoped to get an answer that, obviously, google could not provide. Your reply was very informative and I am sure, helped in the creation of a nice & friendly community. Thanks for your help. Let me help you myself: link

necolas commented 5 years ago

@jkobject in this case it means updating the vendor code files rather than jest snapshots

simonbuerger commented 5 years ago

@necolas what is it you're looking to achieve with the React.forwardRef for View and Text components? I'd like to help, but looking to understand the requirement a bit more first :)

awinograd commented 5 years ago

Hi @necolas, can I claim

Replace context.isInAParentText w/ React.createContext?

DaKaZ commented 5 years ago

@necolas I just submitted a PR #1272 for #1011 - what is the next priority on your list above and I'll get started on that 👍

DaKaZ commented 5 years ago

@necolas I was looking into updating the snapshot for SwipeableListView and I noticed a recent commit to RN that REMOVES it: https://github.com/facebook/react-native/commit/14d9b2d68de77821bd6366bb2b3767f201c6cb4a

Wondering if we should go through the effort of updating/maintaining it? What are your thoughts?

FWIW - the only other changes were FlowFixMe additions and whitespace/formatting changes. I can easily port those if you are interested. I compared with:

git diff v0.55.4 v0.57.5 -- Libraries/Experimental/SwipeableRow/SwipeableListView.js
git diff v0.55.4 v0.57.5 -- Libraries/Experimental/SwipeableRow/SwipeableListViewDataSource.js
DaKaZ commented 5 years ago

Similarly PanResponder has no changes other then eslint/formatting changes as seen by:

git diff v0.55.4 v0.57.5 -- Libraries/Interaction/PanResponder.js

Would you like those formatting changes ported?

mschipperheyn commented 5 years ago

I am working a RN project that we want to bring to the web. It is currently based on 0.57.8. I'm wondering what I should do:

I need to get something together soonish. Any thoughts?

jkobject commented 5 years ago

I am working a RN project that we want to bring to the web. It is currently based on 0.57.8. I'm wondering what I should do:

  • downgrade to 0.55 to get it working on RNW
  • help to try to get RNW to 0.57.8 ASAP (I have no prior experience on RNW, but certainly willing to help)
  • try to work around issues I'm encountering getting it up and running in as is

I need to get something together soonish. Any thoughts?

Hello,

I am in the process of updating without waiting for the new version to come out as I believe we do not need any of the snapshot updates here. I upgraded to the latest expo version with corresponding RN version, to the latest RNW version, babel plugins were updated. we installed babel-preset-react-native as well. It works on phone fine. we had to update some of our code but it was to accommodate the new version of Expo. We also had to move our App.js file for it to be seen by Expo.

Now, we are still a bit blocked on the web version with errors related to parsing problems in the react navigation and react native libraries Module not found: Error: Can't resolve '../../Utilities/Platform' in '/Users/jeremie/piple/piple/node_modules/react-native/Libraries/Components/AppleTV

Which seems strange. I will continue to keep you guys updated if I find anything. Don't hesitate to help (by sending me an email) if you have any advices.

Best, Jérémie.

seahorsepip commented 5 years ago

I am working a RN project that we want to bring to the web. It is currently based on 0.57.8. I'm wondering what I should do:

  • downgrade to 0.55 to get it working on RNW
  • help to try to get RNW to 0.57.8 ASAP (I have no prior experience on RNW, but certainly willing to help)
  • try to work around issues I'm encountering getting it up and running in as is

I need to get something together soonish. Any thoughts?

I'm currently also working on a project with a newer RN version (just updated to 0.59). I was able to get things working with an ugly workaround, by adding the following dependency: "old-react-native": "npm:react-native@0.55.4"

RNW will use "old-react-native" while native apps will use the newer "react-native". Of course this means that any code that uses newer RN version features still won't work on web!

jonthomp commented 5 years ago

@necolas can I claim Use React.forwardRef in Text and Use React.forwardRef in Text?

markymc commented 5 years ago

I'm currently also working on a project with a newer RN version (just updated to 0.59). I was able to get things working with an ugly workaround, by adding the following dependency: "old-react-native": "npm:react-native@0.55.4"

RNW will use "old-react-native" while native apps will use the newer "react-native". Of course this means that any code that uses newer RN version features still won't work on web!

@seahorsepip How has this worked out for you? We did a little prototyping with RNW a year ago, and were planning to use it on an internal project we're about to start, but are now concerned with the lack of progress on this recently. We're now considering https://github.com/microsoft/reactxp instead. Your thoughts would be much appreciated. 🙇

seahorsepip commented 5 years ago

@markymc The mobile code base is the highest priority so we wanted a web version without having to write different code for mobile or affecting the mobile builds in any way.

RNW does just that, which is why we chose it. It also gives us more freedom to experiment with and move to React Native Dom when it becomes more stable.

RNW has given use the possibility of developing for mobile without a simulator or mobile device by using the browser, which helps a lot.

markymc commented 5 years ago

@seahorsepip Thanks for the info. Are you able to use modern features such as hooks with this setup?

seahorsepip commented 5 years ago

@markymc Yes all features that are part of React and not React Native seem to work fine. Which makes sense since you're actually using React.

React Native Web consists of React components that have the same behavior and api as React Native, that's why you need to alias the React Native package to React Native Web.

markymc commented 5 years ago

@seahorsepip Thanks. The reason I asked is that you mentioned your workaround used react-native@0.55.4 for the web, and was thinking that it means we'd be stuck with whichever react version that 0.55.4 version ships with. But then I realised that it would still be using whatever react version is in your package.json, which could be e.g. 16.8.6. Is that correct?

seahorsepip commented 5 years ago

@markymc That's correct.

TL;DR

Oh and let's not go too oftopic in this thread, everybody's getting notified by these comments (sorry). If these are more unrelated technical questions, open a new issue for that topic :)

ValGeorgiev commented 5 years ago

Hi @necolas, could you share your future vision about RNW, please? We have RNW on production and its working nicely, but we are pushed to upgrade RN to newer version. I see that these tasks are not taken for a while. Do you need any contributors help or we are blocked by something else?

DaKaZ commented 5 years ago

@necolas I too share the concerns of @ValGeorgiev - we invested in RNW nearly two years ago and are incredibly thankful for this amazing library and our ability to use it for a production app, but things have really stalled out. How can we help you? Are there more contributors on the project? It sounds like we have lots of folks willing to lend a hand we are just waiting for your guidance. Please let us know so that we can help you :)

piranna commented 5 years ago

Same here, I have used RNW since two years ago, and in my current project using RN 0.58 and moving to 0.59 sóon. When we'll add web support, going back to 0.55 is not an option...

gut4 commented 5 years ago

Looks like we need to wait this https://github.com/facebook/react/issues/15257

piranna commented 5 years ago

Maybe should we update this tasks list to show work needed towards compatibility with React Native 0.59?

evelant commented 5 years ago

I'm also curious about this issue. Won't apps using < 0.59 start being rejected from app stores starting in August because of 64bit? After that point it will more or less be impossible to use an old version like 0.55.

asgvard commented 5 years ago

Latest RNW works fine with RN 0.59, just officially not supported. However would be appreciated to have any guidance to finish these tasks, I guess ppl just need one clear example on what does it mean to update snapshots and how to do it :)

piranna commented 5 years ago

Latest RNW works fine with RN 0.59, just officially not supported.

What does it needs to get to be officially supported (besides an update in README.md :-) )?

tastafur commented 5 years ago

Hello, I would like to make these three tasks @necolas . Update RNTester snapshot Add forwardedRef prop to Text Add forwardedRef prop to View Do I open an issue with your Pull Request for each task?

tastafur commented 5 years ago

Hello, @necolas In this task Update RNTester snapshot, what you want to do is add test snapshot to all RNTester components?

prade commented 5 years ago

I have RNW working with RN 0.60 after doing multiple config overrides using webpack and babel, but unable to get a production build. Waiting for official support so we can override the hacks. Thanks for the library @necolas , this definitely is the future for react development.

Latest RNW works fine with RN 0.59, just officially not supported. However would be appreciated to have any guidance to finish these tasks, I guess ppl just need one clear example on what does it mean to update snapshots and how to do it :)

piranna commented 5 years ago

@prade can you be able to publish your hacks in a pull-request? This way they could be easier merged in master.

piranna commented 5 years ago

And not only that, that also they could be used by others.

tastafur commented 5 years ago

Hello I would like to contribute to these tasks that I have to do? @necolas

necolas commented 5 years ago

Decided not to add more onPress props to Text for the reasons given here https://github.com/necolas/react-native-web/pull/1272#issuecomment-539217703

I've been thinking about this feature for a while, and I think I'm going to exclude it from web by design. Apps like Twitter are using Text everywhere and adding the build and runtime overhead of Touchable to Text is (on balance) going to make the most common use of Text become more expensive. I think RN is doing too much in Text (it didn't use to overload it with press functionality) vs View, and RN should probably redesign its exports to include something like TouchableText.

necolas commented 5 years ago

Updating babel-plugin-tester is currently blocked on https://github.com/babel-utils/babel-plugin-tester/issues/50.

Edit: babel-plugin-tester's unit tests didn't catch the change, and the author closed the issue. I will stick with v5 and stop using babel-plugin-tester in the future. Alternatives: https://babeljs.io/docs/en/next/babel-helper-plugin-test-runner.html, https://github.com/satya164/babel-test

kopax commented 4 years ago

Helo, I am just discovering react-native and I wonder if I should use it for the cross platforme native and web app I want to build.

I see that 0.60 of react-native is out but this is blocked for a while and there's no milestone or release date for this. Can I have you people users opinions, should I expect to be able to upgrade to 0.60 without pain the future if I start building my app with react-native-web or should I just not use react-native-web ?

Thanks for sharing !

mykhailo-melnyk commented 4 years ago

@kopax I am also interested in this

kopax commented 4 years ago

I still do not have my answer and so far I have expo, and making my own. I have not decided yet. Not sure if this should be use, but shouldn't be too hard to make your own react-native-web I am also thinking this as a solution.

necolas commented 4 years ago

I don't know what you're asking. Nothing is blocked on anything and Expo uses RNW with RN 0.60. I'm going to close comments on this issue because they're not helpful and most of the work is complete and will land in master in good time