App crashes without dev client

Expo Development Tools
1

Hello! I’m pretty new to Expo and my app is crashing on any build that doesn’t include the dev client. I’ve run out of things to Google, so any assistance would be appreciated…

I have a managed workflow and I use EAS to build. The crashes happen immediately on both iOS and android when the dev client is excluded. The app functions as expected on both platforms when built with the dev client.

Here are my config files…
eas.json:

{
  "cli": {
    "version": ">= 0.37.0"
  },
  "build": {
    "preview": {
      "distribution": "internal",
      "android": {
        "buildType": "apk"
      }
    },
    "development": {
      "extends": "preview",
      "developmentClient": true
    },
    "production": {}
  },
  "submit": {
    "production": {}
  }
}

app.json:

{
  "expo": {
    "name": "shmoody-client",
    "entryPoint": "./App.tsx",
    "slug": "shmoody-client",
    "version": "1.0.0",
    "orientation": "portrait",
    "icon": "./assets/shmoodyCatIcon.png",
    "splash": {
      "image": "./assets/shmoodyCatIcon.png",
      "resizeMode": "contain",
      "backgroundColor": "#ffffff"
    },
    "scheme": "shmoody",
    "updates": {
      "fallbackToCacheTimeout": 0
    },
    "assetBundlePatterns": ["**/*"],
    "ios": {
      "supportsTablet": true,
      "bundleIdentifier": "com.****.www",
      "config": {
        "googleSignIn": {
          "reservedClientId": "com.googleusercontent.apps.****"
        }
      },
      "googleServicesFile": "./GoogleService-Info.plist"
    },
    "android": {
      "adaptiveIcon": {
        "foregroundImage": "./assets/shmoodyCatIcon.png",
        "backgroundColor": "#FFFFFF"
      },
      "package": "com.****.www",
      "config": {
        "googleSignIn": {
          "certificateHash": "****"
        }
      },
      "googleServicesFile": "./google-services.json"
    },
    "web": {
      "favicon": "./assets/favicon.png"
    },
    "plugins": ["sentry-expo"],
    "hooks": {
      "postPublish": [
        {
          "file": "sentry-expo/upload-sourcemaps",
          "config": {
            "organization": "moodworks-inc",
            "project": "shmoody",
            "authToken": "****"
          }
        }
      ]
    }
  }
}

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-navigation/native": "^6.0.6",
    "@react-navigation/stack": "^6.0.11",
    "@reduxjs/toolkit": "^1.6.2",
    "@sentry/react-native": "^3.2.3",
    "expo": "~43.0.2",
    "expo-apple-authentication": "~4.0.3",
    "expo-application": "~4.0.0",
    "expo-auth-session": "~3.4.2",
    "expo-constants": "~12.1.3",
    "expo-dev-client": "^0.6.3",
    "expo-device": "~4.0.3",
    "expo-google-sign-in": "~10.0.3",
    "expo-random": "~12.0.1",
    "expo-status-bar": "~1.1.0",
    "expo-updates": "~0.10.15",
    "expo-web-browser": "~10.0.3",
    "immer": "^9.0.6",
    "react": "17.0.1",
    "react-dom": "17.0.1",
    "react-native": "0.64.3",
    "react-native-web": "0.17.1",
    "react-redux": "^7.2.6",
    "sentry-expo": "^4.0.0"
  },
  "devDependencies": {
    "@babel/core": "^7.12.9",
    "@types/react": "~17.0.21",
    "@types/react-native": "~0.64.12",
    "@types/react-redux": "^7.1.20",
    "@typescript-eslint/eslint-plugin": "^5.4.0",
    "@typescript-eslint/parser": "^5.4.0",
    "eslint": "^8.2.0",
    "eslint-config-airbnb": "^19.0.0",
    "eslint-config-node": "^4.1.0",
    "eslint-config-prettier": "^8.3.0",
    "eslint-plugin-import": "^2.25.3",
    "eslint-plugin-jsx-a11y": "^6.5.1",
    "eslint-plugin-node": "^11.1.0",
    "eslint-plugin-prettier": "^4.0.0",
    "eslint-plugin-react": "^7.27.0",
    "eslint-plugin-react-hooks": "^4.3.0",
    "prettier": "^2.4.1",
    "typescript": "~4.3.5"
  },
  "private": true
}

And the error from Sentry:

Error: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: undefined.

Most people who get this error have a named vs default import/export issue. I won’t say that’s not the case here, but I do know the difference and I’ve tried using both types on every one of my modules.

Only Android reports the error to Sentry for some reason. I don’t get any crash reports for iOS.

I cannot reproduce the issue in the dev client. The app works fine on both platforms in that case.

Is there any reason that maybe imports/exports work differently when not using the dev client?

Thanks for any help!

2

Okay so I was able to fix the problem in production (without dev client), and discovered that the issue is related to this other issue I was having that is discussed here:

I had done some strange stuff with registerRootComponent in order to fix the “illegal operation” error in development, but whatever I did was causing the “Element type is invalid” issue in production.

So, for the moment, my app errors out in development, but works in production. And the only fix I’ve found ends up breaking the app in production. What a world!

3

Figured out the problem.

I’m new to Expo so I never used the classic expo build and so I hadn’t read through the Migrating documentation here:

The link above (specifically the section regarding registerRootComponent) explains how to set up your file structure and package.json when using eas build.

That was the major issue, but it took me awhile with more errors to realize I had to update the “entryPoint” in the app.json file as well.

So the answer for anyone dealing with the same issue is as follows:

  1. create an index.js file that calls registerRootComponent
  2. export default your chosen root component (and import it in index.js)
  3. change the “entryPoint” in your app.json to “./index.js”
  4. (not sure if necessary) change “main” in package.json to “index.js”
1 Like
4

This topic was automatically closed 20 days after the last reply. New replies are no longer allowed.