react-native upgrade instructions need improvement

[chetstone]

It seems that after upgrading react-native you have to manually change "rnx-kit": { "reactNativeVersion": } in package.json. This is not mentioned in the instructions.

I just installed @rnx-kit/dep-check@^1.13.0 and used it to check dependencies on my RN 0.62.3 project. It worked fine (more or less--- there were a couple of package changes it recommended that broke my app, so I reverted those).

Anyway, I have now upgraded RN to 0.70.1 and when I follow the directions here it tries to downgrade react-native back to 0.62.3.

First I run yarn rnx-dep-check --set-version 0.70 or yarn rnx-dep-check --set-version 0.70.1

Then when I run yarn rnx-dep-check --vigilant 0.70 the output is:

yarn run v1.22.19
$ /Users/chet/prj/malas/apple/node_modules/.bin/rnx-dep-check --vigilant 0.70.1
- Current
+ Expected

  {
[... some unchanged lines removed ...]
    "devDependencies": {
      "@babel/core": "^7.12.9",
      "@babel/runtime": "^7.12.5",
      "@react-native-community/eslint-config": "^2.0.0",
      "@rnx-kit/dep-check": "^1.13.0",
      "@types/jest": "^26.0.5",
      "@types/react": "16.9.0",
      "@types/react-native": "0.61.4",
      "@types/react-test-renderer": "^16.9.2",
      "babel-core": "^6.0.0",
      "babel-jest": "^26.6.3",
      "babel-loader": "^6.2.4",
      "babel-polyfill": "^6.9.1",
      "babel-preset-es2015": "^6.5.0",
      "babel-preset-react": "^6.5.0",
      "babel-preset-stage-1": "^6.5.0",
      "babelify": "^6.1.3",
      "browserify": "^11.0.1",
      "code-push": "^1.10.0-beta",
      "eslint": "^7.32.0",
      "exports-loader": "^0.6.2",
      "express": "^4.12.3",
-     "jest": "^26.6.3",
+     "jest": "^24.8.0",
      "json-loader": "^0.5.4",
-     "metro-react-native-babel-preset": "^0.72.1",
+     "metro-react-native-babel-preset": "^0.58.0",
      "node-libs-browser": "^0.5.2",
      "patch-package": "^6.2.0",
      "postinstall-postinstall": "^2.0.0",
      "prettier": "2.0.5",
      "proxy-middleware": "^0.11.0",
      "raw-loader": "^0.5.1",
      "react-hot-loader": "^1.2.8",
-     "react-test-renderer": "18.1.0",
+     "react-test-renderer": "16.11.0",
      "require-from": "^0.10.0",
      "source-map": "^0.5.6",
      "typescript": "^3.9.7",
      "webpack": "^1.11.0",
      "webpack-dev-server": "^1.10.1"
    },
    "dependencies": {
      "@firebase/app-types": "0.x",
      "@react-native-community/datetimepicker": "^3.0.9",
      "@react-native-community/netinfo": "^5.9.10",
      "@react-native-community/push-notification-ios": "1.10.1",
      "@types/alt": "^0.16.39",
      "alt": "=0.17.1",
      "alt-mixins": "chetstone/mixins#chetstone-patch-1",
      "bugsnag-react-native": "^2.23.6",
      "create-react-class": "^15.6.3",
      "debug": "chetstone/debug#no-document",
      "deep-equal": "^1.0.1",
      "firebase": "8",
      "hoist-non-react-statics": "^3.3.0",
      "localforage": "^1.2.7",
      "markdown-to-react-components": "^0.2.0",
      "moment": "^2.10.6",
      "moment-duration-format": "^2.2.2",
      "prop-types": "^15.7.2",
-     "react": "18.1.0",
+     "react": "16.11.0",
      "react-bootstrap": "^0.28.3",
      "react-dom": "16.11.0",
-     "react-native": "0.70.1",
+     "react-native": "^0.62.3",
      "react-native-button": "^2.3.0",
      "react-native-code-push": "6.2.1",
      "react-native-device-info": "https://github.com/chetstone/react-native-device-info.git#rn61",
      "react-native-dialog-input": "^1.0.8",
-     "react-native-gesture-handler": "1.6.1",
+     "react-native-gesture-handler": "^1.9.0",
      "react-native-iap": "^4.6.3",
      "react-native-idle-timer": "^2.1.6",
      "react-native-image-base64": "^0.1.4",
      "react-native-image-picker": "^1.1.0",
      "react-native-image-resizer": "^1.4.5",
      "react-native-mail": "^4.0.0",
      "react-native-modal-datetime-picker": "9.2.3",
      "react-native-orientation": "^3.1.3",
      "react-native-palette": "^1.0.0",
      "react-native-push-notification": "^8.1.1",
      "react-native-radio-buttons": "^1.0.0",
      "react-native-reanimated": "^1.13.3",
      "react-native-safe-area-context": "^3.1.9",
      "react-native-safe-area-view": "^1.0.0",
      "react-native-sortable-list": "gitim/react-native-sortable-list#78c8ec0e66ba792784131065fbeab3f365deb0dc",
      "react-native-sound": "^0.11.0",
      "react-native-status-bar-height": "^2.5.0",
      "react-native-swipe-list-view": "^2.5.0",
      "react-native-tableview": "^3.0.0",
      "react-native-tableview-simple": "^3.1.0",
      "react-native-tabs": "^1.0.9",
      "react-native-vector-icons": "^6.6.0",
-     "react-native-webview": "11.22.7",
+     "react-native-webview": "^11.0.3",
      "react-navigation": "^3.11.1",
      "react-navigation-props-mapper": "^0.4.0",
      "react-router": "^2.0.0",
      "react-timer-mixin": "^0.13.3"
    },
    "jest": {
      "preset": "react-native"
    },
    "resolutions": {
      "@types/react": "=16.9.0"
    },
    "rnx-kit": {
      "reactNativeVersion": "^0.62",
      "kitType": "app",
      "capabilities": [
        "animation",
        "babel-preset-react-native",
        "core",
        "core-android",
        "core-ios",
        "datetime-picker",
        "gestures",
        "jest",
        "netinfo",
        "react",
        "react-dom",
        "react-test-renderer",
        "safe-area",
        "webview"
      ]
    }
  }
info Visit https://aka.ms/dep-check for more information about dep-check.
Done in 0.17s.

If I add --write to the previous command, it makes the proposed changes to my package.json file, sending me back to RN 0.62.3.

So I finally noticed the rnx-kit section in my package.json file and manually changed it to ^0.70. Now it works better.

(Note-- The first instruction in the Upgrading React Native talks about changing the PR Loop definition. I'm not sure what a "PR Loop" is but as a solo developer I don't use PR's so I don't think I have one. )

[tido64]

Hi @chetstone,

Running --set-version should've bumped reactNativeVersion:

% yarn rnx-dep-check --set-version 0.70
% git diff
diff --git a/packages/test-app/package.json b/packages/test-app/package.json
index 557c102b..b7a554c2 100644
--- a/packages/test-app/package.json
+++ b/packages/test-app/package.json
@@ -25,10 +25,10 @@
     "start": "react-native rnx-start"
   },
   "dependencies": {
-    "react": "17.0.2",
-    "react-native": "^0.68.0",
-    "react-native-macos": "^0.68.0",
-    "react-native-windows": "^0.68.0"
+    "react": "18.1.0",
+    "react-native": "^0.70.0",
+    "react-native-macos": "^0.70.0",
+    "react-native-windows": "^0.70.0"
   },
   "devDependencies": {
     "@babel/core": "^7.12.9",
@@ -50,7 +50,7 @@
     "@types/react-native": "^0.68.0",
     "jest-cli": "^27.5.1",
     "metro-react-native-babel-preset": "^0.67.0",
-    "react-native-test-app": "^1.3.5",
+    "react-native-test-app": "^1.6.9",
     "react-test-renderer": "17.0.2",
     "typescript": "^4.0.0"
   },
@@ -61,7 +61,7 @@
     "preset": "@rnx-kit/scripts"
   },
   "rnx-kit": {
-    "reactNativeVersion": "^0.68",
+    "reactNativeVersion": "^0.70.0",
     "kitType": "app",
     "build": {
       "distribution": [

Can you check again that --set-version works as described? If it doesn't, can you create a repro so I can investigate the issue?

[msftbot[bot]]

This issue has been automatically marked as stale because it has been marked as requiring author feedback but has not had any activity for 14 days. It will be closed if no further activity occurs within 14 days of this comment.