ReactVision / viro

ViroReact: The AR and VR library for React Native 📳💙💛🤍💚
MIT License
1.31k stars 149 forks source link

Stuck on Splash Screen on iOS when integrating with Expo. #125

Open bigxalx opened 2 years ago

bigxalx commented 2 years ago

I followed the official docs to install with Expo:

The app starts and shows the splash screens. It successfully connects to Metro, bundles and downloads Javascript but keeps showing the splash screen forever. If I create a production build via expo run:ios --configuration Release -d, the app works. If I run the dev build on iOS Simulator or on Android (device or simulator), the app works.

I did some troubleshooting and found the following: I tried running this project: https://github.com/vnovick/viro-expo-eas-sample and it works. If I run expo prebuild --clean on this project, and then build, I get the same behaviour as described above.

Environment

  1. Development OS: macOS 12.3.1
  2. Device OS & Version: iOS 15.4.1
  3. Versions: "@viro-community/react-viro": "^2.23.0" "expo": "~44.0.0", "expo-dev-client": "~0.8.4", "react-native": "0.64.3",
  4. Device(s): iPhone Xs
PatrikTheDev commented 2 years ago

Also ran into the same issue with Expo and EAS Build

scrolls-mckenzie commented 2 years ago

Hello, This took a lot of wrangling but i've managed to get passed most of these issues. I know for a fact that I will forget something as there have been a lot of attempts and I hope to detail as much as possible. I have also commented on another topic #140

Firstly, I have followed your above steps and reproduced. My issues seemed to be related to a few differing thing so a couple of small changes to start might help.

  1. I have now been able to launch the build on an iOS device connected via USB and now have the error that the Tabs and TSX setup is incorrect. Might start with a bare and try again
  2. Spent some time making sure that I had all my creds in Apple and Expo sorted before beginning before attempting the build. This helps when you want to test and after creating the correct developer accounts, using the expo credentials:manager to sort. This was a little fiddly but once in should be good.
  3. Moving the whole project to a User folder location and not in the standard Desktop or Documents. This was Mac specific as the watchman program needed the correct permissions to execute.
  4. Create a blank .watchmanconfig file in the root of the project. This is supposed to auto config if the perms are there but in my case I added a blank array brackets [square bois] to mine as it complained in an error.
  5. Again probably a mac only issue, but if you have the above setup correctly and you still have to allow watchman to have the permissions to run. For me, this was going to System Preferences -> Privacy -> Full Disk Access and allowing Terminal to have full. I then had to search for the watchamn system manually and add all parts in the folder. Again, for me on a new mac, that was in /usr/local/Cellar/watchman and then added all the watchman executable's (Not sure if i need them all but was at the point where i was trying all things)

With all of things in place i was able to move further into the build and setup than i had previously. I had also install expo-updates as you will need that to push up. At this stage I also ran the expo build:ios as the system was complaining that there is no main.jsbundle so it could not copy it into the launch-able. I have no idea if this was resolved by a part or all of the changes. I had attempted mucking around in xcode for a bit to fix this but right now my xcode console is still saying it doesn't exist and I cant find that file so that may be a red herring. After futzing around with the build in non user location, moving to a user folder I not longer opened xcode for anything and was able to get my build running. Unfortunately, and of coarse after all of the above, my build fails with Invalid UIAccessabilityTraits 'tablist'. I will start the project again with a bare build as I only used tabs and tsx to verify this issue and resolve if it could be done. It also seems from more reading that the original attempt to use Expo Go for Viro was fraught with peril as the custom code wont load in the default Go app.

Hope this may help out anyone who is in this pickle

EvanBacon commented 2 years ago

I can confirm this config plugin has errors.

When building, the script that evaluates the app.json breaks because the plugin is not transpiled for Node LTS environments:

/Users/evanbacon/Documents/GitHub/lab/expo-viro-demo/node_modules/@viro-community/react-viro/dist/plugins/withViroAndroid.js:17
            const mainApplicationPath = path_1.default.join(config.modRequest.platformProjectRoot, "app", "src", "main", "java", ...(config?.android?.package?.split?.(".") || []), "MainApplication.java");
                                                                                                                                            ^

SyntaxError: Unexpected token '.'
    at wrapSafe (internal/modules/cjs/loader.js:1054:16)
    at Module._compile (internal/modules/cjs/loader.js:1102:27)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:1158:10)
    at Module.load (internal/modules/cjs/loader.js:986:32)
    at Function.Module._load (internal/modules/cjs/loader.js:879:14)
    at Module.require (internal/modules/cjs/loader.js:1026:19)
    at require (internal/modules/cjs/helpers.js:72:18)
    at Object.<anonymous> (/Users/evanbacon/Documents/GitHub/lab/expo-viro-demo/node_modules/@viro-community/react-viro/dist/plugins/withViro.js:3:27)
    at Module._compile (internal/modules/cjs/loader.js:1138:30)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:1158:10)
Command PhaseScriptExecution failed with a nonzero exit code

We recommend using a tsconfig that transpiles to Node 14 like:

{
  "extends": "@tsconfig/node14/tsconfig.json",
  "compilerOptions": {
    "declaration": true
  }
}

Other pointers