[Docs] How to upgrade React Native version (original: How do you update a React Native app with the latest version of React Native?)

[bretrouse]

The title says it all.

[ranyefet]

did you try running npm update?
also make sure to re-run the packager and re-build the app after updating.

[bretrouse]

I can update the global node package fine, I'm specifically talking about updating an app that exists already after updating the global package.

When you say re-run the packager, do you mean to init a new project?

[brentvatne]

I update the package.json to point to the specific version that I want then do npm install again

[bretrouse]

Thanks Brent, but will that pickup changes to iOS files? I think it would just affect the node_modules/react-native/* correct?

[bretrouse]

I guess what I'm looking for is a react-native update AwesomeProject command but I think it all has to be done manually right now. I've been creating a new project and copying files over.

[brentvatne]

@bretrouse - yup the iOS files will update too, you might have to restart Xcode to be safe. You will occasionally run into problems if new modules are renamed eg: when websocket was added, the included project was renamed from RCTWebSocketDebugger.xcodeproj to RCTWebSocket.xcodeproj, but for the most part it will just work because it will just be referring to React.xcodeproj and other required components by relative path to node_modules (not actually copying it anywhere).

I think a good approach to this will just be to include anything such as the websocket change into the breaking changes in the changelog for each release. Creating an update command is probably overkill here because it will generally be quite straightforward to do. Maybe if this becomes more complicated it will be worth re-visiting. cc @vjeux

[brentvatne]

@bretrouse - you raise a good point though, this should be made clear in the docs

[gyzerok]

Same problem here. I guess making migrations manually is real overhead for the developer. Especially since React Native is now in the early stage with frequent updates.

[coderdave]

To anyone getting here because the debugger no longer works after upgrading react native, it's because as @brentvatne pointed out, RCTWebSocketDebugger.xcodeproj was renamed to RCTWebSocket.xcodeproj.

To fix this, I had to start a new react native project and copy the AwesomeProject.xcodeproj file to my project, rename it back to what I had, and the debugger worked again.

[chirag04]

react-native upgrade command is now available. Docs here: https://facebook.github.io/react-native/docs/upgrading.html#content

[asadakbar]

@chirag04 Just wanted to clarify if the command is react-native update or react native upgrade as the page you linked to didn't mention update.

[chirag04]

yes, it's upgrade. Thanks for pointing out.

[nodkrot]

If I upgrade my app following this doc: https://facebook.github.io/react-native/docs/upgrading.html
it will walk me through every file to upgrade but because I use third party npm packages that require to be added to the project lib the upgrade command keeps on erasing them, and I have to manually diff the file and upgrade line by line. Is there a safer way to lock packages or to upgrade without depending on packages?

[uc-hus]

Implementation problum in android. https://cloud.githubusercontent.com/assets/12196308/16729003/714ba294-4787-11e6-9e76-cc1dcdcdeb16.png

[dwilt]

To elaborate more on what @nodkrot said: I'm running into the exact same issue. I have many 3rd party plugins - for analytics, push notifications, user authentication, etc - and every time I upgrade I have to fix these conflicts. Even things for the launch icons.

What's interesting is that this isn't like a git merge either. I keep having to do the same files over and over again with each RN release but it doesn't seem like they have actually changed. An example would be the AppDelegate.m file for iOS. Back in May they added: rootView.backgroundColor = [[UIColor alloc] initWithRed:1.0f green:1.0f blue:1.0f alpha:1]; Since then, I've seen this change in the conflicts come up with every time I've upgraded. It would be helpful if it just conflicted when there truly was a change to a new file so I didn't have to keep doing the ones I just did a month ago all over again.

[uc-hus]

Why UI showing different in Android emulator and Android Mobile device.

[bravokeyl]

@uc-hus Better ask this on StackOverflow.