Workflow: managed
eas-cli: 0.50.0
expo: 44.0.6
react: 17.0.2
react-native: 0.64.3
After upgrading to SDK 44 and changing to EAS, I have a problem with my app.
It works perfectly and without any errors
- with
expo start - with
expo start --no-dev --minifyaccording to Debugging - Expo Documentation
It bundles and builds in the EAS workflow and produces an installable APK.
But:
When opening the APK, I see only a blank white screen.
The app dosn’t yet make use of the splashscreen module. So if I understood it correctly the splashscreen should’t be waiting to be hidden.
I have a monorepo with the application sitting in packages/mobile (project original based on apollo-universal-starter-kit).
Already figured out, that EAS cannot work with “main”: “src” in package.json, so I added an index.js just loading the index file from the src-folder.
Inspecting the logs via adb logcat | grep my.app.name I can confirm, that the application code is loaded.
A part of the app registers a task fetch-calendarentries that appears in line 80 of the log.
Furthermore, the
So the question remains, why does the APK built by EAS only show a blank page?
I’d really appreciate any ideas and suggestions on how to go on from here to find the problem in my app.
Latest build: Build Details — d01e68c2-8d89-43eb-8f2e-9bcc0ba19746 — mivao — Expo
adb logcat | grep my.app.nam (pastebin)
package.json
"name": "mivao",
"private": true,
"cacheDirectories": [
"ignored"
],
"version": "1.0.0",
"pm": "yarn@3.2.0-rc.12",
[...]
"workspaces": [
"config",
"packages/*",
"modules/app/**/client-react",
"modules/app/**/client-react-native",
"modules/app/**/common",
"modules/app/**/common-react",
"modules/app/**/server-ts",
"modules/coremodules/**/client-react",
"modules/coremodules/**/client-react-native",
"modules/coremodules/**/common",
"modules/coremodules/**/common-react",
"modules/coremodules/**/server-ts",
"modules/util/*"
],
"greenkeeper": {
"ignore": [
"graphql"
]
},
"devDependencies": {
"@alienfast/i18next-loader": "^1.1.4",
"@babel/cli": "^7.0.0",
"@babel/core": "^7.17.0",
"@babel/plugin-proposal-class-properties": "^7.0.0",
"@babel/plugin-proposal-decorators": "^7.0.0",
"@babel/plugin-proposal-nullish-coalescing-operator": "^7.0.0",
"@babel/plugin-proposal-object-rest-spread": "^7.0.0",
"@babel/plugin-proposal-optional-chaining": "^7.0.0",
"@babel/plugin-syntax-dynamic-import": "^7.0.0",
"@babel/plugin-transform-destructuring": "^7.0.0",
"@babel/plugin-transform-for-of": "^7.0.0",
"@babel/plugin-transform-modules-commonjs": "^7.0.0",
"@babel/plugin-transform-regenerator": "^7.0.0",
"@babel/plugin-transform-runtime": "^7.0.0",
"@babel/preset-env": "^7.0.0",
"@babel/preset-flow": "^7.0.0",
"@babel/preset-react": "^7.0.0",
"@babel/preset-typescript": "^7.0.0",
"@babel/register": "^7.0.0",
"@babel/runtime": "^7.0.0",
"@graphql-tools/mock": "^8.5.1",
"@loadable/babel-plugin": "^5.13.2",
"@loadable/webpack-plugin": "^5.15.2",
"@tailwindcss/postcss7-compat": "npm:@tailwindcss/postcss7-compat@^2.2.17",
"autoprefixer": "^9.5.0",
"babel-core": "^7.0.0-0",
"babel-eslint": "^10.0.1",
"babel-jest": "^24.8.0",
"babel-loader": "^8.2.4",
"babel-plugin-dynamic-import-node": "^2.2.0",
"babel-preset-minify": "^0.5.0-alpha.5a128fd5",
"core-js": "^3.1.3",
"cross-env": "^5.1.8",
"css-loader": "^6.7.1",
"eslint": "^5.16.0",
"eslint-config-airbnb": "^17.1.0",
"eslint-plugin-import": "^2.17.2",
"eslint-plugin-jest": "^22.5.1",
"eslint-plugin-json": "^1.4.0",
"eslint-plugin-jsx-a11y": "^6.2.1",
"eslint-plugin-prettier": "^3.0.1",
"eslint-plugin-react": "^7.12.4",
"eslint-plugin-react-hooks": "^1.6.0",
"html-webpack-plugin": "^5.0.0",
"http-proxy-middleware": "^0.19.0",
"husky": "^1.1.2",
"ignore-loader": "^0.1.2",
"isomorphic-style-loader": "^5.1.0",
"jest": "^26.2.2",
"jest-transform-graphql": "^2.1.0",
"jest-transform-stub": "^2.0.0",
"lerna": "^4.0.0",
"license-checker": "^25.0.1",
"lint-staged": "^7.1.2",
"mini-css-extract-plugin": "^2.6.0",
"node-hmr-plugin": "^1.0.1",
"npm-run-all": "^4.1.5",
"openurl": "^1.1.1",
"postcss-loader": "^6.2.1",
"prettier": "^2.4.1",
"qrcode-terminal": "^0.12.0",
"raw-loader": "^0.5.1",
"regenerator-runtime": "^0.13.2",
"sass": "^1.49.7",
"sass-loader": "^12.6.0",
"shelljs": "^0.8.1",
"source-list-map": "^2.0.0",
"style-loader": "^3.3.1",
"thread-loader": "^3.0.4",
"ts-invariant": "^0.9.4",
"tslint": "^6.1.3",
"tslint-config-prettier": "^1.18.0",
"tslint-plugin-prettier": "^2.3.0",
"typescript": "^4.4.3",
"wait-on": "^3.2.0",
"webpack": "^5.72.0",
"webpack-cli": "^4.9.2",
"webpack-dev-server": "^4.8.1",
"webpack-manifest-plugin": "^5.0.0",
"webpack-node-externals": "^3.0.0",
"whatwg-fetch": "^2.0.4"
},
"dependencies": {
"classnames": "^2.3.1",
"expo": "^44.0.0",
"inquirer": "^6.2.2",
"lodash": "^4.17.21"
}
}
packages/mobile/package.json
{
"name": "mobile",
"private": true,
"version": "1.0.0",
"main": "src",
[...]
"dependencies": {
"@apollo/client": "^3.5.10",
"@expo/vector-icons": "^12.0.5",
"@gqlapp/debug-client-react-native": "^0.1.0",
"@gqlapp/progress-client-react": "^1.0.0",
"@react-native-async-storage/async-storage": "~1.15.0",
"@react-native-community/masked-view": "^0.1.10",
"@react-navigation/bottom-tabs": "^5.11.7",
"@react-navigation/compat": "^5.3.10",
"@react-navigation/drawer": "^5.11.4",
"@react-navigation/native": "^5.8.10",
"@react-navigation/stack": "^5.12.8",
"@sentry/react-native": "^3.4.1",
"apollo3-cache-persist": "^0.13.0",
"clean-webpack-plugin": "^4.0.0",
"copy-webpack-plugin": "^10.2.4",
"dayjs": "^1.10.5",
"eas-cli": "^0.50.0",
"expo": "^44.0.0",
"expo-app-loading": "^1.3.0",
"expo-application": "^4.0.2",
"expo-background-fetch": "~10.1.0",
"expo-cli": "^5.0.3",
"expo-constants": "~13.0.2",
"expo-device": "~4.1.0",
"expo-file-system": "~13.1.2",
"expo-font": "^10.0.4",
"expo-keep-awake": "^10.0.1",
"expo-localization": "~12.0.0",
"expo-notifications": "~0.14.0",
"expo-screen-orientation": "^4.1.2",
"expo-secure-store": "~11.1.0",
"expo-task-manager": "~10.1.0",
"expo-updates": "~0.11.6",
"expo-web-browser": "~10.1.0",
"file-loader": "^6.2.0",
"filesize": "^3.5.11",
"graphql": "^16.3.0",
"graphql-scalars": "^1.10.1",
"graphql-tag": "^2.11.0",
"html-loader": "^3.1.0",
"i18next": "^11.2.3",
"immutability-helper": "^2.6.2",
"jest-expo": "^44.0.1",
"lodash": "^4.17.4",
"metro-minify-terser": "^0.67.0",
"minilog": "^3.1.0",
"native-base": "^2.13.5",
"optimize-css-assets-webpack-plugin": "^6.0.1",
"prop-types": "^15.6.0",
"react": "^17.0.2",
"react-debounce-input": "^3.2.3",
"react-i18next": "^11.15.4",
"react-native": "0.64.3",
"react-native-collapsible": "^1.5.3",
"react-native-easy-grid": "^0.2.2",
"react-native-elements": "^0.19.1",
"react-native-gesture-handler": "~2.1.0",
"react-native-get-random-values": "^1.5.0",
"react-native-keyboard-spacer": "^0.4.1",
"react-native-mime-types": "^2.2.1",
"react-native-modal": "^5.4.0",
"react-native-reanimated": "~2.3.1",
"react-native-safe-area-context": "~3.3.2",
"react-native-screens": "~3.10.1",
"react-native-simple-picker": "^3.1.1",
"react-redux": "^7.2.6",
"redux": "^4.1.2",
"sentry-expo": "^4.0.0",
"subscriptions-transport-ws": "^0.11.0",
"url-loader": "^4.1.1",
"uuid": "^3.3.2"
},
"devDependencies": {
"@bam.tech/react-native-graphql-transformer": "^0.1.4",
"@types/jest": "^24.0.13",
"@types/react-native-keyboard-spacer": "^0.4.1",
"@types/react-navigation": "^3.0.5",
"@types/react-test-renderer": "^16.0.2",
"babel-plugin-transform-inline-environment-variables": "^0.4.3",
"caporal": "^0.10.0",
"chai": "^4.1.2",
"chai-http": "^4.0.0",
"compression": "^1.7.1",
"connect": "^3.6.5",
"cross-env": "^5.1.1",
"eslint": "^5.16.0",
"freeport-async": "^1.1.1",
"image-size": "^0.6.2",
"jest": "^26.2.2",
"jsdom": "^11.5.1",
"mkdirp": "^0.5.1",
"react-test-renderer": "16.11.0",
"request": "^2.83.0",
"rimraf": "^2.6.2",
"tslib": "^2.3.1",
"ws": "^5.1.1"
}
}
packages/mobile/build.config.js
const config = {
...require('../../build.config'),
__SERVER__: false,
__CLIENT__: true,
__TEST__: false,
__API_URL__: process.env.API_URL || 'http://localhost:8080/graphql',
__WEBSITE_URL__: process.env.WEBSITE_URL || 'http://localhost:8080',
};
module.exports = config;
packages/mobile/metro.config.js
const { getDefaultConfig } = require('expo/metro-config');
const path = require('path');
// Find the workspace root, this can be replaced with `find-yarn-workspace-root`
const workspaceRoot = path.resolve(__dirname, '../..');
const projectRoot = __dirname;
const config = getDefaultConfig(projectRoot);
// 1. Watch all files within the monorepo
config.watchFolders = [workspaceRoot];
// 2. Let Metro know where to resolve packages, and in what order
config.resolver.nodeModulesPaths = [
path.resolve(projectRoot, 'node_modules'),
path.resolve(workspaceRoot, 'node_modules'),
];
config.transformer.babelTransformerPath = require.resolve('./custom-transformer');
config.resolver.sourceExts = [
'native.ts',
'native.tsx',
'native.js',
'native.jsx',
'ts',
'tsx',
'js',
'jsx',
'cjs',
'mjs',
'json',
'graphql',
'gql',
];
module.exports = config;