create-react-native-app: Expo client app stuck at "Building JavaScript bundle... 100%"

I think I found my issue, might have been pause on exception in remote debugging tools.

Hi! Please try on a fresh project with the newest CRNA and Expo – you should get more feedback from the loading screen now. Report back if you’re still having issues and we’ll reopen.

“Building javascript bundle… 97.88%” got stuck all the time. Tried both on emulator and android device. I could not able to run the app yet.

Did anyone find the solution?

With a CRNA created today (and hosted at exp://45.33.51.230:19000), I am seeing the console report a successful packaging and my Expo app is stuck on 99.88%

Reinstalling Expo fixed the issue of “Finished building JavaScript bundle in X ms” for me.

On Android emulators, the way to fix these intermittent errors of complete unresponsiveness is to close the app on the Android emulator then start the build process anew. This menu is available on my emulator by clicking on the square icon near the bottom phone frame and this menu is generally on the right.

Simply restarting the emulator will leave you in the same (broken) saved state.

I solved this Issue by performing the following steps:

1. Open Developer-Tools in Chrome / Firefox (Browser you are using to debug with Expo / iOS simulator)
2. Press CMD + D in your iOS Simulator and Toggle “Remote Debugging” (Even if it is not activated)
3. Switch to your Browsers Console

This solved my problem.

Reinstalling the Expo app in iOS and pressing R in the terminal to restart the packager and clear the cache did the trick.

When I start up my Android Samsung S8+ device over wifi or Genymotion S8 emulator on the same machine to access the expo project using expo xde, in the Chrome console, I see the following errors:

Failed to load http://192.168.1.6:19004/node_modules/expo/AppEntry.delta?platform=android&dev=true&strict=false&minify=false&hot=false&assetPlugin=G:\Projects\bt\ff\node_modules\expo\tools\hashAssetFiles: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:19004' is therefore not allowed access. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled.
Uncaught (in promise) TypeError: Failed to fetch

I believe this could potentially be caused by updating sdkVersion from 24.0.0 to 25.0.0. @brentvatne Do you have any idea? Does anyone not have this issue?

I believe it could be related to this issue reported 9 days ago which seems similar to what @jugutier has: https://github.com/facebook/react-native/issues/17618

I can’t debug and see what’s happening on Redux 😭

Okay, I think the CORS error that @jugutier and I are experiencing is different to the original issue…

It won’t let me downgrade to 24.0.0 😭

If it’s a brand new project, recently created, not edited yet, I don’t know what it could be, but if you had edited something this may help (I’ve only been using RN for three days now 😅) :

Everything was working just fine till I received a NaN from the color I was using as underlayColor for my TouchableHighlight; I come from React web, so I decided to debug the old way, with a console.log and added the L2:

const underlayColor = color('#fff').darken(0.2).rgb().string()
console.log(undarlayColor) // a console.log outside the scope
const InputWithButton = ({
  onPress, buttonText, editable = true, ...props
}) => ...

Doing so, my code gets stuck at 100%; after spending 2 hours trying figure out what was going on, I removed the console.log and everything went back to normal. Then I debugged using react-devtools and fixed the issue.

So if you’re getting stuck compiling at 100% maybe a mistake like this related to your Javascript not compatible with React Native philosophy (An unwrapped text, a bad console.log, things like that). Hope it helps 😃

Seems like this might need reopened. This is happening very frequently on a CRNA setup on a new macbook this morning.

When the remote developer tools open, hit cmd-shift-c to open the console. https://umaar.com/dev-tips/32-pause-on-exception/ Just untick the box if it is ticked. If it isn’t then you probably have a different issue, sometimes I find the best is to create a new app with create-react-native-app and copy paste over your files

To add some more information, I was running an ejected app when this happened and on iOS 11.2.2. Didn’t get to see this on expo because I had already ejected, but I’m happy to test if that helps. This was reproducible 100% of the times I tried. Even after creating fresh with react-native-init.

On Jan 24, 2018, at 7:34 AM, psyanite notifications@github.com wrote:

When I start up my device over wifi to access the expo project, in the Chrome console, I see the following errors:

Failed to load http://192.168.1.6:19004/node_modules/expo/AppEntry.delta?platform=android&dev=true&strict=false&minify=false&hot=false&assetPlugin=G:\Projects\bt\ff\node_modules\expo\tools\hashAssetFiles: No ‘Access-Control-Allow-Origin’ header is present on the requested resource. Origin ‘http://localhost:19004’ is therefore not allowed access. If an opaque response serves your needs, set the request’s mode to ‘no-cors’ to fetch the resource with CORS disabled. Uncaught (in promise) TypeError: Failed to fetch I believe this could potentially be caused by updating sdkVersion from 24.0.0 to 25.0.0. @brentvatne Do you have any idea? Does anyone not have this issue?

I believe it could be related to this issue reported 9 days ago which seems similar to what @jugutier has: facebook/react-native#17618

I can’t debug and see what’s happening on Redux 😭

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub, or mute the thread.

Having this issue today, error in live inspector tab is:

Failed to load http://10.0.1.57.xip.io:8081/index.delta?platform=ios&dev=true&minify=false: No ‘Access-Control-Allow-Origin’ header is present on the requested resource. Origin ‘http://localhost:8081’ is therefore not allowed access. If an opaque response serves your needs, set the request’s mode to ‘no-cors’ to fetch the resource with CORS disabled. (index):188 Uncaught (in promise) TypeError: Failed to fetch

I’m not sure if my issue is related, however, sharing my experience with such behaviour might help you:

I’ve had problems deploying the app to my android phone. Running on an emulator worked fine; however, when starting the app using the Expo android app (over tunnel), the app on my android phone kept stuck at “Building JavaScript… 100%” without launching the actual app. Tried everything, I installed the expo app 2 days ago (so it cant be an old build or anything like that) - on emulator everything was fine, on phone I could not start the app.

However, for me, reinstalling the Expo android app did the trick. Maybe that helps someone else as well 😃

@phantoxe I am getting the same issue. CRNA made roughly >10 days ago and suddenly a few days ago started totally freezing on app startup. I just “fixed” it partially by copying the code to a brand new create-react-native-app. I think someone screwed up a patch update somewhere…

I had same issue yesterday, but in my case, I had used a view component with a style of display:‘none’ over other components with styles. Once I took that out, and cleared my npm cache, everything was good. Mine worked on android prior to my discovery of the bug though. Good luck.