Build error after updating to 5.2.10

[panda0603]

Current Behavior

updated @react-navigation/bottom-tabs, native, stack to latest version just now. Getting above error.

Already tried deleting the cache, but no luck

Your Environment

software	version
iOS or Android	both
@react-navigation/native	5.1.5
@react-navigation/stack	5.2.10
react-native-gesture-handler	1.6.1
react-native-safe-area-context	0.7.3
react-native-screens	2.4.0
react-native	0.61.5
npm or yarn	npm

[gregoryfm]

Same issue here

I found these similar issues #7978 #6267

[raajnadar]

Did you try upgrading typescript to latest version?

[raajnadar]

Typescript users do this

1) Delete node_modules & lock file (yarn.lock or package.lock) 2) Upgrade typescript to latest i.e. 3.8.3 3) Run yarn cache clean or npm cache clean 4) Run yarn or npm install 5) Run yarn react-native start --reset-cache 6) Run yarn react-native run-android

Non typescript users do this

1) Run yarn add --dev @babel/core@^7.9.0 @babel/runtime@^7.9.0 2) Uninstall apk from emulator/phone 3) Run yarn react-native start --reset-cache 4) Run yarn react-native run-android

If that did not work cd android and run gradlew clean or ./gradlew clean remove the apk from you phone. Re run yarn react-native run-android

[gregoryfm]

Hi @raajnadar

I'm not using either typescript or hermes.

I already tried removed node_modules, yarn.lock, cleared yarn cache and installed using npm/yarn But still the same error.

[raajnadar]

Try doing this for android.

cd android and run gradlew clean

Run yarn react-native run-android

[gregoryfm]

I tried that as well, same error..

[raajnadar]

This is the last solution that I can give delete the apk that is installed by adb on you phone. Make sure you delete the app for all the users.

After that gradlew clean and re run now.

[nickyleach]

You can ignore the below, I was just making a silly mistake with version ranges

---

I wonder if something went wrong publishing the packages? I tried downgrading to 5.2.8 but it resolves to 5.2.10. From my yarn.lock:

"@react-navigation/stack@^5.2.8":
  version "5.2.10"
  resolved "https://registry.yarnpkg.com/@react-navigation/stack/-/stack-5.2.10.tgz#a2c8ff7f2da8f0d5cb04351379106ee9b8ef7dd8"
  integrity sha512-QOx+ak+nLox9h4iwxL6+eJ6ndo4C43BVibN8/EWLydvcHB078eqSCKB77PS6XsohGGe0xbD/+jTOYbvPpfpjGw==
  dependencies:
    color "^3.1.2"
    react-native-iphone-x-helper "^1.2.1"

Note the discrepancy between the dependency's version tag and the resolved version

[raajnadar]

@nickyleach If you have this in package.json "@react-navigation/stack": "~5.2.0" it will resolve to 5.2.10. If you want to use exact version make this changes "@react-navigation/stack": "5.2.8".

Don't use this ~ and ^ before version number.

[nickyleach]

I needed to upgrade Babel. Support for type-only imports + exports was added in 7.9.0 https://github.com/babel/babel/pull/11171

[gregoryfm]

@nickyleach for which version? Upgraded both @babel/core and @babel/runtime ?

[raajnadar]

This is the version in my project

"@babel/core": "^7.6.2" "@babel/runtime": "^7.6.2"

@gregoryfm try version 7.9.0

[nickyleach]

@gregoryfm I only have a direct devDependency on @babel/core

[VictorAtPL]

For me, following steps helped:

1. npm install @babel/core@^7.9.0
2. npm install @babel/runtime@^7.9.2
3. npm install typescript@^3.8.3
4. rm -rf node_modules
5. npm install
6. Uninstall app in emulator/phone.
7. npm start -- --reset-cache

[jojonarte]

updating @babel/core and @babel/runtime did the trick for my environment.

[degemenc]

This is the version in my project

"@babel/core": "^7.6.2" "@babel/runtime": "^7.6.2"

@gregoryfm try version 7.9.0

This worked for me.

[satya164]

Duplicate of #7978

[ghost]

same issue here

[Vannevelj]

On top of the babel updates and cleaning node_modules, I also had to regenerate the yarn.lock -- it must've been pinning me and my colleague to an older version.

[FortisFortuna]

Still get the issues (about 20 of these) after trying all of the npm cache cleanings, reinstall, package-lock, etc:

node_modules/@react-navigation/routers/lib/typescript/src/index.d.ts:9:98 - error TS1109: Expression expected.

9 export type { DrawerActionHelpers, DrawerActionType, DrawerRouterOptions, DrawerNavigationState, } from './DrawerRouter';
                                                                                                   ~

node_modules/@react-navigation/routers/lib/typescript/src/index.d.ts:9:105 - error TS1005: ';' expected.

9 export type { DrawerActionHelpers, DrawerActionType, DrawerRouterOptions, DrawerNavigationState, } from './DrawerRouter';
                                                                                                          ~~~~~~~~~~~~~~~~

node_modules/@react-navigation/stack/lib/typescript/src/index.d.ts:34:1 - error TS1128: Declaration or statement expected.

34 export type { StackNavigationOptions, StackNavigationProp, StackHeaderProps, StackHeaderLeftButtonProps, StackHeaderTitleProps, StackCardInterpolatedStyle, StackCardInterpolationProps, StackCardStyleInterpolator, StackHeaderInterpolatedStyle, StackHeaderInterpolationProps, StackHeaderStyleInterpolator, } from './types';

my package.json portion is

"dependencies": {
    "@babel/core": "^7.9.0",
    "@babel/runtime": "^7.9.2",
    "@react-native-community/async-storage": "^1.9.0",
    "@react-native-community/datetimepicker": "^2.3.2",
    "@react-native-community/masked-view": "^0.1.9",
    "@react-navigation/drawer": "^5.4.1",
    "@react-navigation/native": "^5.1.5",
    "@react-navigation/routers": "^5.3.0",
    "@react-navigation/stack": "^5.2.10",
    "@types/react-native-snap-carousel": "^3.8.1",
    "@types/redux-logger": "^3.0.7",
    "@types/socket.io-client": "^1.4.32",
    "@types/styled-components": "^5.1.0",
    "@types/ws": "^7.2.4",
    "age-to-birth-date": "^1.1.4",
    "capitalize": "^2.0.3",
    "expo": "^37.0.7",
    "expo-constants": "^9.0.0",
    "expo-device": "~2.1.0",
    "expo-location": "^8.1.0",
    "expo-permissions": "^8.1.0",
    "get-age": "^1.0.1",
    "haversine": "^1.1.1",
    "human-names": "^1.0.11",
    "lodash": "^4.17.15",
    "lorem-ipsum": "^2.0.3",
    "react": "~16.13.1",
    "react-devtools": "^4.6.0",
    "react-dom": "~16.13.1",
    "react-native": "https://github.com/expo/react-native/archive/sdk-36.0.0.tar.gz",
    "react-native-collapsible": "^1.5.2",
    "react-native-gesture-handler": "^1.6.1",
    "react-native-gifted-chat": "^0.13.0",
    "react-native-keyboard-spacer": "^0.4.1",
    "react-native-maps": "^0.27.1",
    "react-native-picker-select": "^7.0.0",
    "react-native-reanimated": "^1.8.0",
    "react-native-safe-area-context": "^0.7.3",
    "react-native-screens": "^2.4.0",
    "react-native-snap-carousel": "^3.9.0",
    "react-native-table-component": "^1.2.1",
    "react-native-web": "~0.12.2",
    "react-redux": "^7.2.0",
    "redux": "^4.0.5",
    "redux-actions": "^2.6.5",
    "redux-devtools-extension": "^2.13.8",
    "redux-thunk": "^2.3.0",
    "slugify": "^1.4.0",
    "socket.io-client": "^2.3.0",
    "styled-components": "^5.1.0",
    "uuid": "^7.0.3"
  },
  "devDependencies": {
    "@types/react": "~16.9.34",
    "@types/react-native": "~0.62.2",
    "babel-preset-expo": "~8.1.0",
    "redux-logger": "^3.0.6",
    "remote-redux-devtools": "^0.5.16",
    "remotedev-rn-debugger": "^0.8.4",
    "typescript": "^3.8.3"
  },

Using expo as well

[satya164]

@FortisFortuna update the typescript package

[FortisFortuna]

Turns out my console tsc was not the same tsc installed by npm install -g typescript. You can check this via tsc --version. Make sure it is at least 3.8.3. Once I upgraded that, the errors went away. Make sure your PATH is set up in the correct order and includes the same path as npm -g bin. Thank you guys for the help!

[joao-gabriel-malaquias-borges]

This also happened with me. In my case I upgrade react-navigation and react-navigation-stack from version 4.x to version 5.x and then I got a similar error. Seems like what's happening is this:

I needed to upgrade Babel. Support for type-only imports + exports was added in 7.9.0 babel/babel#11171

So I got fix it like that:

updating @babel/core and @babel/runtime did the trick for my environment.

To achieve the fix I was go to my expo directory 'MyApplication>MobileApplication' then I run on command prompt from vs code:

yarn add @babel/core@^7.9.0 yarn add @babel/runtime@^7.9.2

After that, my package.json is looking like that:

"devDependencies": {
    "@babel/core": "7.9.0",
    "babel-preset-expo": "~8.0.0"
},

Now it's solved

[raajnadar]

Locked the thread because it is getting noisy. We have many solutions in this thread.

[wwwbruno1981]

It worked for me by updating (@ babel / core)

yarn add @babel/core

[louicoder]

It worked for me by updating (@ babel / core)

yarn add @babel/core

This solution worked for me

[NSLog0]

I have the same issue. I did try all solution those didn't work for me

"dependencies": {
    "@expo/vector-icons": "^12.0.0",
    "@react-native-community/masked-view": "0.1.10",
    "@react-navigation/bottom-tabs": "5.11.2",
    "@react-navigation/native": "~5.8.10",
    "@react-navigation/stack": "~5.12.8",
    "expo": "~40.0.0",
    "expo-asset": "~8.2.1",
    "expo-constants": "~9.3.0",
    "expo-font": "~8.4.0",
    "expo-linking": "~2.0.0",
    "expo-splash-screen": "~0.8.0",
    "expo-status-bar": "~1.0.3",
    "expo-web-browser": "~8.6.0",
    "react": "16.13.1",
    "react-dom": "16.13.1",
    "react-native": "https://github.com/expo/react-native/archive/sdk-40.0.1.tar.gz",
    "react-native-gesture-handler": "~1.8.0",
    "react-native-safe-area-context": "3.1.9",
    "react-native-screens": "~2.15.0",
    "react-native-web": "~0.13.12"
  },
  "devDependencies": {
    "@babel/core": "^7.12.13",
    "@types/react": "~16.9.35",
    "@types/react-native": "~0.63.2",
    "jest-expo": "~40.0.0",
    "typescript": "~4.0.0"
  },

[mlecoq]

Same with a fresh new expo project 40.0.1, I have tried a blank (js) project and a blank typescript one and on both I have this issue (even if I upgrade @babel/core or typescript) - after ejecting from expo, It works fine

[raajnadar]

Can you add a repo? This is a very old issue

[mlecoq]

@raajnadar here it is : https://github.com/mlecoq/reactNavigationIssue7981

[bntzio]

Same issue...

[NSLog0]

if you're using expo use yarn start don't use expo start

[bntzio]

@NSLog0 I'm using yarn start.

[bntzio]

I'm not using TypeScript...

[david-arteaga]

In case it helps someone, I had the same issue today with the following dependencies using expo:

"@react-navigation/bottom-tabs": "5.11.2",
"@react-navigation/native": "~5.8.10",
"@react-navigation/stack": "~5.12.8",

I tried removing yarn.lock and node_modules, clearing the yarn cache and the metro bundler cache, installing the latest versions of babel core and babel runtime, and still got the same error.

I had to uninstall the expo cli globally, and remove a bunch of globally installed packages that had any relation to babel/typescript. After I did that, I generated a new app with expo init and it finally worked.

[raajnadar]

Yes many users reported that removing some global packages helped to fix this issues. It seems like using the global packages of expo-cli is causing this issue.

[bntzio]

Removing the global expo-cli pkg and adding it to the project solved the issue for me.

yarn global remove expo-cli // or npm uninstall expo-cli -g
yarn add expo-cli -D // or npm install expo-cli --save-dev

[ankitgauravapporio]

if nothing works update your Cli https://stackoverflow.com/questions/51826728/react-native-bundle-sha-1-for-file-not-computedunable-to-load-script-from-asset

[sanket2226]

Typescript users do this

1. Delete node_modules & lock file (yarn.lock or package.lock)
2. Upgrade typescript to latest i.e. 3.8.3
3. Run yarn cache clean or npm cache clean
4. Run yarn or npm install
5. Run yarn react-native start --reset-cache
6. Run yarn react-native run-android

Non typescript users do this

1. Run yarn add --dev @babel/core@^7.9.0 @babel/runtime@^7.9.0
2. Uninstall apk from emulator/phone
3. Run yarn react-native start --reset-cache
4. Run yarn react-native run-android

If that did not work cd android and run gradlew clean or ./gradlew clean remove the apk from you phone. Re run yarn react-native run-android

not working

[github-actions[bot]]

Hey! This issue is closed and isn't watched by the core team. You are welcome to discuss the issue with others in this thread, but if you think this issue is still valid and needs to be tracked, please open a new issue with a repro.