This looks like a bug in your JavaScript code. If this was working correctly before the upgrade then it could be that the syntax for an import statement has changed.
Apparently this is what lead to the issue :
iOS Bundling failed 5426ms
Unable to resolve module react-native-dropdownmenus from C:\Users\hp\ecommerce delivery\Grocer-app\src\screens\ProductPage.js: react-native-dropdownmenus could not be found within the project.
If you are sure the module exists, try these steps:
- Clear watchman watches: watchman watch-del-all
- Delete node_modules and run yarn install
- Reset Metro’s cache: yarn start --reset-cache
- Remove the cache: rm -rf /tmp/metro-*
14 | import { AddCartContext, AddSavedContext } from “…/screens/CartContext”;
15 | import { RNCarousel } from “react-native-carousel-cards”;
16 | import DropdownMenu from “react-native-dropdownmenus”;
| ^
17 |
18 | export default function ProductPage({ route, navigation }) {
i ran expo install react-native-dropdownmenus but nothing happened so i removed the import and function from the project which then led to the earlier issue where you said theres a “Bug in the project”
This library includes native code, so it is incompatible with Expo Go.
You should be able to use Expo Build to build a custom dev client instead, but it might make more sense to find another library to use instead. So this definitely would not have worked before the upgrade.
Ideally, if at all possible, you should make sure that the app works before you try to upgrade it.
I removed the dropdown menu feature from the app plus the import but it gave the following error message:
TypeError: undefined is not an object (evaluating ‘_useContext.updateCart’)
This error is located at:
in HomeScreen (at SceneView.tsx:130)
in StaticContainer
in StaticContainer (at SceneView.tsx:123)
in EnsureSingleNavigator (at SceneView.tsx:122)
in SceneView (at useDescriptors.tsx:181)
in RCTView (at View.js:34)
in View (at createAnimatedComponent.js:165)
in AnimatedComponent (at createAnimatedComponent.js:215)
in ForwardRef(AnimatedComponentWrapper) (at BottomNavigation.tsx:649)
in RCTView (at View.js:34)
in View (at createAnimatedComponent.js:165)
in AnimatedComponent (at createAnimatedComponent.js:215)
in ForwardRef(AnimatedComponentWrapper) (at BottomNavigation.tsx:634)
in RCTView (at View.js:34)
At this point i am lost.
Here is the latest commit
Looks like you’re using useContext incorrectly, but I haven’t used it before. This is unrelated to your initial upgrade problems.
Hey so apparently i cloned the repo and ran expo upgrade 39.0.0 and installed all the remaining dependencies using expo install and the app started working again. Really appreciate the constant help because i know it isnt easy. So i want to run expo upgrade 40.0.0 until i reach expo upgrade 42.0.0 . Also i have a few questions regarding expo features, is there an Expo feature that can run
- User email, google authentication {sign in , Sign up}
- Product Checkout with custom payment provider
- Database to store user info like order history, user info
- Database to display products on app
Great 
There are a couple of ways of doing Google authentication, but for Sign up you’d need a backend server, but then again it seems you’ll need a backend server for some of the other stuff too. Search docs.expo.dev for authentication and/or google.
There is this, but these days it’s deprecated and they recommend using @stripe/stripe-react-native instead. (This requires EAS Build, I believe).
In theory you could use other libraries like Razor Pay etc., but for those you would still need EAS Build and would probably have to write a Config Plugin for it to work in the managed workflow. @stripe/stripe-react-native already has a Config Plugin.
There is SQLite. This can get a bit tricky, though. Search the forums for other people using it. If you have a backend server you might not need a database on the phone, and it seems you would need to store stuff like order history on a backend server anyway. Obviously if you want to improve the user experience by caching the order history locally, that might be a good reason to use SQLite on the device.
What about using firebase for user authentication, user info storage and Database to display products?
Ah, yes, I suppose so. I have never tried Firebase, though.
Alright i’ll check the documentations on firebase, yeah i ran the expo upgrade 40.0.0 and ran all the expo install <dependencies> and ran expo start this is what i got:
None of these files exist:
- node_modules\expo\build\launch\RootErrorBoundary(.native|.ios.expo.ts|.native.expo.ts|.expo.ts|.ios.expo.tsx|.native.expo.tsx|.expo.tsx|.ios.expo.js|.native.expo.js|.expo.js|.ios.expo.jsx|.native.expo.jsx|.expo.jsx|.ios.ts|.native.ts|.ts|.ios.tsx|.native.tsx|.tsx|.ios.js|.native.js|.js|.ios.jsx|.native.jsx|.jsx|.ios.json|.native.json|.json)
- node_modules\expo\build\launch\RootErrorBoundary\index(.native|.ios.expo.ts|.native.expo.ts|.expo.ts|.ios.expo.tsx|.native.expo.tsx|.expo.tsx|.ios.expo.js|.native.expo.js|.expo.js|.ios.expo.jsx|.native.expo.jsx|.expo.jsx|.ios.ts|.native.ts|.ts|.ios.tsx|.native.tsx|.tsx|.ios.js|.native.js|.js|.ios.jsx|.native.jsx|.jsx|.ios.json|.native.json|.json)
1 | import * as ErrorRecovery from ‘expo-error-recovery’;
2 | import * as React from ‘react’;
3 | import Notifications from ‘…/Notifications/Notifications’;
4 | export default function withExpoRoot(AppRootComponent) {
Which repository are you using now?
Presumably not relaxedtomato/Grocer-app since that’s over a year old and is still on SDK 38.
I see both kennymanman/Grocer-app and kennymanman/grocery-app have been updated to SDK 39 recently.
Yeah its kennymanman/grocery-app i havent commited the change that is giving the error to repo which happened when i tried to run expo upgrade 40.0.0
That app doesn’t run because of the useContext-related errors.
The Project was working before i ran the expo upgrade 40.0.0.
It is saying that there is an issue with the expo file or node module:
Unable to resolve module ./RootErrorBoundary from C:\Users\hp\garden-app\node_modules\expo\build\launch\withExpoRoot.js:
None of these files exist:
- node_modules\expo\build\launch\RootErrorBoundary(.native|.ios.expo.ts|.native.expo.ts|.expo.ts|.ios.expo.tsx|.native.expo.tsx|.expo.tsx|.ios.expo.js|.native.expo.js|.expo.js|.ios.expo.jsx|.native.expo.jsx|.expo.jsx|.ios.ts|.native.ts|.ts|.ios.tsx|.native.tsx|.tsx|.ios.js|.native.js|.js|.ios.jsx|.native.jsx|.jsx|.ios.json|.native.json|.json)
- node_modules\expo\build\launch\RootErrorBoundary\index(.native|.ios.expo.ts|.native.expo.ts|.expo.ts|.ios.expo.tsx|.native.expo.tsx|.expo.tsx|.ios.expo.js|.native.expo.js|.expo.js|.ios.expo.jsx|.native.expo.jsx|.expo.jsx|.ios.ts|.native.ts|.ts|.ios.tsx|.native.tsx|.tsx|.ios.js|.native.js|.js|.ios.jsx|.native.jsx|.jsx|.ios.json|.native.json|.json)
1 | import * as ErrorRecovery from ‘expo-error-recovery’;
2 | import * as React from ‘react’;
3 | import Notifications from ‘…/Notifications/Notifications’;
4 | export default function withExpoRoot(AppRootComponent) {
Unless you committed (some of) those changes and pushed them to GitHub, or else did not push the latest commit from just before you ran expo upgrade 40.0.0, I don’t see how that’s possible.
The project (on GitHub) is currently on SDK version 39, and it appears not to be using useContext correctly.
It’s hard for me to figure out what the error boundary issue is if I can’t even run your app without it crashing immediately.
Apologies i meant the garden-app in my repository
OK, this one runs, although it complains as follows, which is something you should resolve:
fontFamily "Roboto_medium" is not a system font and has not been loaded through Font.loadAsync.
- If you intended to use a system font, make sure you typed the name correctly and that it is supported by your device operating system.
- If this is a custom font, be sure to load it with Font.loadAsync.
at node_modules/expo-font/build/Font.js:29:16 in processFontFamily
at node_modules/react-native/Libraries/ReactNative/renderApplication.js:54:4 in renderApplication
at node_modules/react-native/Libraries/ReactNative/AppRegistry.js:117:25 in runnables.appKey.run
at node_modules/react-native/Libraries/ReactNative/AppRegistry.js:213:4 in runApplication
Upgrading to SDK 40 seems fine so far:
% expo upgrade 40.0.0
Your git working tree is clean
To revert the changes after this command completes, you can run the following:
git clean --force && git reset --hard
✔ Would you like to upgrade the Expo app in the iOS simulator? … no
✔ Would you like to upgrade the Expo app in the Android emulator? … no
Installing the expo@^40.0.0 package...
Validating configuration.
Updating your app.json to account for breaking changes (if applicable)...
Updating packages to compatible versions (where known).
Updating packages to compatible versions (where known).
Removing package-lock.json and deleting node_modules.
Installing node_modules and rebuilding package-lock.json.
Clearing the packager cache.
Clearing the packager cache.
👏 Automated upgrade steps complete.
...but this doesn't mean everything is done yet!
✅ The following packages were updated:
react-native-gesture-handler, react-native-screens, expo-font, @react-native-community/masked-view, expo-status-bar, react-native-safe-area-context, react-native-reanimated, react-native, react, react-dom, @babel/core, react-native-web, babel-preset-expo, expo
🚨 The following packages were not updated. You should check the READMEs for those repositories to determine what version is compatible with your new set of packages:
@material-ui/core, @react-native-community/picker, @react-navigation/bottom-tabs, @react-navigation/drawer, @react-navigation/material-bottom-tabs, @react-navigation/native, @react-navigation/stack, native-base, react-native-auth0, react-native-bottomsheet-reanimated, react-native-carousel-cards, react-native-dropdownmenus, react-native-elements, react-native-interactable-reanimted, react-native-masonry-list, react-native-number-please, react-native-numeric-input, react-native-paper, react-native-picker-select, react-native-popup-menu, react-native-vector-icons, react-navigation-drawer, react-redux, reanimated-bottom-sheet, redux, rn-sliding-up-panel, styled-components, styled-system
Please refer to the release notes for information on any further required steps to update and information about breaking changes:
https://blog.expo.io/expo-sdk-40-is-now-available-d4d73e67da33
Now would be a good time to check what’s been updated and commit the changes:
% git status
On branch master
Your branch is up to date with 'origin/master'.
Changes not staged for commit:
(use "git add/rm <file>..." to update what will be committed)
(use "git restore <file>..." to discard changes in working directory)
deleted: package-lock.json
modified: package.json
no changes added to commit (use "git add" and/or "git commit -a")
package.json is expected, but package-lock.json should not be deleted. I see that the node_modules directory is also gone. That’s definitely unexpected, but we can get it back by running npm install:
% npm install
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! While resolving: undefined@undefined
npm ERR! Found: react-native@0.63.2
npm ERR! node_modules/react-native
npm ERR! react-native@"https://github.com/expo/react-native/archive/sdk-40.0.1.tar.gz" from the root project
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer react-native@"^0.41.2" from react-native-dropdownmenus@1.0.6
npm ERR! node_modules/react-native-dropdownmenus
npm ERR! react-native-dropdownmenus@"^1.0.6" from the root project
npm ERR!
npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with --force, or --legacy-peer-deps
npm ERR! to accept an incorrect (and potentially broken) dependency resolution.
npm ERR!
npm ERR! See /Users/michael/.npm/eresolve-report.txt for a full report.
npm ERR! A complete log of this run can be found in:
npm ERR! /Users/michael/.npm/_logs/2021-09-07T20_49_07_859Z-debug.log
Ah, OK, it’s this problem again. We need to run npm install --legacy-peer-deps:
% npm install --legacy-peer-deps
[...]
added 1170 packages, and audited 1171 packages in 4m
[...]
Looks better. And git status looks as expected too:
% git status
On branch master
Your branch is up to date with 'origin/master'.
Changes not staged for commit:
(use "git add <file>..." to update what will be committed)
(use "git restore <file>..." to discard changes in working directory)
modified: package-lock.json
modified: package.json
no changes added to commit (use "git add" and/or "git commit -a")
So now’s a good time to commit the changes.
% git commit -a -m "Upgrade to Expo SDK 40"
[master cf09ac7] Upgrade to Expo SDK 40
2 files changed, 4069 insertions(+), 2119 deletions(-)
If I try expo start now it should work (unless there were breaking changes that needed to be sorted out. So ideally you should read the release notes/changelog, but for now I’ll just see if it crashes:
% expo start
[...]
"account-card-details-outline" is not a valid icon name for family "material-community"
at node_modules/@expo/vector-icons/build/createIconSet.js:36:20 in Icon#render
at node_modules/react-native/Libraries/ReactNative/renderApplication.js:54:4 in renderApplication
at node_modules/react-native/Libraries/ReactNative/AppRegistry.js:117:25 in runnables.appKey.run
at node_modules/react-native/Libraries/ReactNative/AppRegistry.js:213:4 in runApplication
"account-card-details-outline" is not a valid icon name for family "material-community"
at node_modules/@expo/vector-icons/build/createIconSet.js:36:20 in Icon#render
at node_modules/react/cjs/react.development.js:471:2 in Component.prototype.setState
at node_modules/@expo/vector-icons/build/createIconSet.js:23:37 in Icon#componentDidMount
There’s a new warning. It looks like this icon has been renamed to “card-account-details-outline”.
May as well commit that after fixing the icon too:
% git commit -a -m "Fix icon name"
[master be3bede] Fix icon name
1 file changed, 2 insertions(+), 2 deletions(-)
Now it’s happy (other than the font issue from earlier, but that seems unrelated to upgrades.)
You could go through the other dependencies now that were not automatically upgraded to check if they need to be upgraded too, but since they’re working OK at the moment I’m inclined to leave them for the moment.
Voilà! We’re on Expo SDK 40. I only tested that it starts OK, so you should also check that it all works as expected before trying to upgrade to SDK 41. Also read the SDK 41 release notes to see if there are any breaking changes you need to worry about.
But I’ll assume the app is working OK and will keep going. Kill expo start, and run expo upgrade 41.0.0. This worked the same as for SDK 40 and also resulted in a missing package-lock.json and node_modules, so run npm install --legacy-peer-deps again. (By the way, if you get tired of having to run it manually after upgrades with the --legacy-peer-deps option you might want to try yarn instead of npm. If you do this you should get rid of package-lock.json and commit yarn.lock instead.)
That goes smoothly, so commit with git commit -a -m "Upgrade to Expo SDK 41", test the app again and fix any issues. Commit those changes if there are any.
Then repeat with expo upgrade 42.0.0. This goes the same again. Run npm install --legacy-peer-deps, test and fix issues, commit your changes. You’re now on SDK 42.
I think the main issue you’re running into now is having to run npm install --legacy-peer-deps after each upgrade. After all of this I can run your app on SDK 42. As I said above I did not test it much more than whether or not it starts.
Apparently i am still getting the same error, I followed your instructions but when i run expo start it still displays the error below, Maybe you could clone my latest commit
iOS Bundling failed 3020ms
Unable to resolve module ./RootErrorBoundary from C:\Users\hp\garden-app\node_modules\expo\build\launch\withExpoRoot.js:
None of these files exist:
- node_modules\expo\build\launch\RootErrorBoundary(.native|.ios.expo.ts|.native.expo.ts|.expo.ts|.ios.expo.tsx|.native.expo.tsx|.expo.tsx|.ios.expo.js|.native.expo.js|.expo.js|.ios.expo.jsx|.native.expo.jsx|.expo.jsx|.ios.ts|.native.ts|.ts|.ios.tsx|.native.tsx|.tsx|.ios.js|.native.js|.js|.ios.jsx|.native.jsx|.jsx|.ios.json|.native.json|.json)
- node_modules\expo\build\launch\RootErrorBoundary\index(.native|.ios.expo.ts|.native.expo.ts|.expo.ts|.ios.expo.tsx|.native.expo.tsx|.expo.tsx|.ios.expo.js|.native.expo.js|.expo.js|.ios.expo.jsx|.native.expo.jsx|.expo.jsx|.ios.ts|.native.ts|.ts|.ios.tsx|.native.tsx|.tsx|.ios.js|.native.js|.js|.ios.jsx|.native.jsx|.jsx|.ios.json|.native.json|.json)
1 | import * as ErrorRecovery from ‘expo-error-recovery’;
2 | import * as React from ‘react’;
3 | import Notifications from ‘…/Notifications/Notifications’;
4 | export default function withExpoRoot(AppRootComponent) {
The only difference between the version I was working on and your latest commit is as follows:
% git diff 5d493f81b8428e8668f593bce79462a6bcabdcba origin/master
diff --git package-lock.json package-lock.json
index e4c836b..55d913d 100644
--- package-lock.json
+++ package-lock.json
@@ -1,5 +1,5 @@
{
- "name": "Grocer-app",
+ "name": "garden-app",
"lockfileVersion": 2,
"requires": true,
"packages": {
Run git status and dir and paste the output here.
C:\Users\hp\garden-app> git status
On branch master
Your branch is ahead of ‘origin/master’ by 1 commit.
(use “git push” to publish your local commits)
nothing to commit, working tree clean