Keep getting "SyntaxError: Unexpected token 'export'" - what can i do/ what is going wrong?

Viewed 1022

I keep getting this error. I have tried multiple different node.js versions (12, 13, 14) and still get the error. I also tried using val instead of import but that didn't work.

here is my code:

import {createAppContainer } from 'react-navigation'
import {createStackNavigator } from 'react-navigation-stack'
import SearchScreen from './src/screens/SearchScreen'
    
const navigator = createStackNavigator({
        Search: SearchScreen
    },
    {
        initialRouteName: 'Search',
        defaultNavigationOptions: {
        title: 'Business Search'
    }
})
    
export default createAppContainer(navigator)

and here is the error:

/Users/macbook/Downloads/food-boilerplate/node_modules/react-navigation/src/index.js:1
export * from '@react-navigation/core';
^^^^^^

SyntaxError: Unexpected token 'export'
    at wrapSafe (internal/modules/cjs/loader.js:979:16)
    at Module._compile (internal/modules/cjs/loader.js:1027:27)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:1092:10)
    at Module.load (internal/modules/cjs/loader.js:928:32)
    at Function.Module._load (internal/modules/cjs/loader.js:769:14)
    at Module.require (internal/modules/cjs/loader.js:952:19)
    at require (internal/modules/cjs/helpers.js:88:18)
    at [stdin]:7:24
    at Script.runInThisContext (vm.js:133:18)
    at Object.runInThisContext (vm.js:310:38)
[Finished in 0.427s]

Any help is really appreciated - i've been trying to sort this out for >5 hours now.

Thanks :)

package.json:

{
  "main": "node_modules/expo/AppEntry.js",
  "scripts": {
    "start": "expo start",
    "android": "expo start --android",
    "ios": "expo start --ios",
    "web": "expo start --web",
    "eject": "expo eject"
  },
  "dependencies": {
    "@react-native-community/masked-view": "0.1.6",
    "axios": "^0.21.1",
    "babel": "^6.23.0",
    "expo": "^37.0.0",
    "react": "16.9.0",
    "react-dom": "16.9.0",
    "react-native": "https://github.com/expo/react-native/archive/sdk-37.0.1.tar.gz",
    "react-native-gesture-handler": "~1.6.0",
    "react-native-reanimated": "~1.7.0",
    "react-native-safe-area-context": "0.7.3",
    "react-native-screens": "~2.2.0",
    "react-navigation": "^4.4.3",
    "react-navigation-stack": "^2.10.2"
  },
  "devDependencies": {
    "@babel/core": "^7.12.10",
    "babel-preset-expo": "^8.3.0"
  },
  "private": true
}
1 Answers

here's what my imports for React Navigation look like:

import { NavigationContainer } from "@react-navigation/native";
import { createStackNavigator } from "@react-navigation/stack";

I'm using the ones provided in the official documentation. I don't know if that makes any difference but give it a look.

Related