React-native-windows: Unable to download JS bundle

[abhivijay96]

I followed the steps described in https://www.microsoft.com/developerblog/real-life-code/2016/05/27/Creating-Universal-Windows-Apps-with-React-Native.html to create a new react native uwp project from scratch. I get the following message when I run the app from visual studio .Please help
,I am running this in x64 and local machine
here is a screenshot of the error.

[awyl]

I had the same issue few days ago. Try goto command line to the project folder. Then
react-native start
This should start the packager.

[abhivijay96]

Thank you, it worked, but now it says "requiring unknown module fbjs/lib/invariant" in the same way, in a red box. Someone please help.

[rozele]

Can you check your node_modules folder and make sure node_modules\fbjs\lib\invariant.js exists?

[abhivijay96]

Yes,it does exist,is there anyway that i can get rid of this issue?

[abhivijay96]

I re installed all the node modules and it started working thanks for the help.

[mowi22]

I'm still getting this error on my windows 10 mobile device even after running "react -native start". App builds and deploys successfully but still I get Red Screen. Any help?

[abhivijay96]

Can you please tell what the error says?
On 22-Jun-2016 9:55 pm, "mowi22" [email protected] wrote:

I'm still getting this error on my windows 10 mobile device even after
running "react -native start". App builds and deploys successfully but
still I get Red Screen. Any help?

—
You are receiving this because you modified the open/close state.
Reply to this email directly, view it on GitHub
https://github.com/ReactWindows/react-native-windows/issues/478#issuecomment-227798707,
or mute the thread
https://github.com/notifications/unsubscribe/APy2bPvMjiDoNXcGYNyoPFbo-604Njo_ks5qOWHdgaJpZM4I2jln
.

[mowi22]

"Unable to download JS bundle"

[abhivijay96]

Try this, go to
react-native-windows/blob/master/ReactWindows/ReactNative/DevSupport/DevInternalSettings.cs
in your node modules directory and change " debug_http_host " in the string
constants to local IP address (ip4) of your PC

Eg : something like http://192.168.99.1:port

Where port is where your react native server is listening.
Please try this
On 22-Jun-2016 10:17 pm, "Abhishek Vijay" [email protected] wrote:

Can you please try refreshing it a few times.
On 22-Jun-2016 10:16 pm, "mowi22" [email protected] wrote:

"Unable to download JS bundle"

Uploading wp_ss_20160622_0001.png…

—
You are receiving this because you modified the open/close state.
Reply to this email directly, view it on GitHub
https://github.com/ReactWindows/react-native-windows/issues/478#issuecomment-227804660,
or mute the thread
https://github.com/notifications/unsubscribe/APy2bCWFo2vaYKByaeY7YcQvFIjBmL_iks5qOWbGgaJpZM4I2jln
.

[rozele]

@mowi22 There is a known issue where the packager server may crash during a build. Can you check the cmd window where you are running react-native start and see if the server is still online? If it's not, simply restart it with react-native start and hit the "Reload JavaScript" button.

[chukcha-wtf]

Maybe a similar issue - can't access the bundled file index.windows.bundle in DebugBundle mode.

File seems to be referenced correctly in MainPage.cs

#if BUNDLE
        public override string JavaScriptBundleFile
        {
            get
            {
                return "ms-appx:///ReactAssets/index.windows.bundle";
            }
        }
#endif

and bundle is properly generated. Also ReactAssets folder is included into the project

[mowi22]

@rozele @abhivijay96 neither solution worked for me. Here's a screenshot of my environment when I get the red screen. I am on VMWARE (not sure if that has anything to do with it). This is in the output of VS15 Exception thrown: 'System.Net.Http.HttpRequestException' in mscorlib.ni.dll.

[abhivijay96]

Please try changing the local ip address in the constant to the local ip
address of the VM.
On 23-Jun-2016 3:04 pm, "mowi22" [email protected] wrote:

@rozele https://github.com/rozele @abhivijay96
https://github.com/abhivijay96 neither solution worked for me. Here's a
screenshot of my environment when I crash. I am on VMWARE (not sure if that
has anything to do with it). This is in the output of VS15 Exception
thrown: 'System.Net.Http.HttpRequestException' in mscorlib.ni.dll.
[image: screen shot 2016-06-23 at 4 26 36 am]
https://cloud.githubusercontent.com/assets/2376639/16298376/c2b180fe-38fa-11e6-917d-2c04b184b997.png

—
You are receiving this because you were mentioned.
Reply to this email directly, view it on GitHub
https://github.com/ReactWindows/react-native-windows/issues/478#issuecomment-227998337,
or mute the thread
https://github.com/notifications/unsubscribe/APy2bAsJcopauwZ51ASaBwOgp1Y1mG7jks5qOlM8gaJpZM4I2jln
.

[mowi22]

@abhivijay96 Yes, thats the Ip I used. It didn't work. I tried on port 8081

[abhivijay96]

Can you please restart the server after you did the changes in that file?
On 23-Jun-2016 3:27 pm, "mowi22" [email protected] wrote:

@abhivijay96 https://github.com/abhivijay96 Yes, thats the Ip I used.
It didn't work. I tried on port 8081

—
You are receiving this because you were mentioned.
Reply to this email directly, view it on GitHub
https://github.com/ReactWindows/react-native-windows/issues/478#issuecomment-228004187,
or mute the thread
https://github.com/notifications/unsubscribe/APy2bDDZDGuoTJ6e7OaVV2SQ4GrDT3dcks5qOliXgaJpZM4I2jln
.

[mowi22]

@abhivijay96 Yes, I've started and restarted the server as @rozele suggested, before and after switching from "debug_http_host" to "my VM's IP".

[abhivijay96]

What does the red screen say in the phone?
On 23-Jun-2016 7:59 pm, "mowi22" [email protected] wrote:

@abhivijay96 https://github.com/abhivijay96 Yes, I've started and
restarted the server as @rozele https://github.com/rozele suggested,
before and after switching from "debug_http_host" to "my VM's IP.

—
You are receiving this because you were mentioned.
Reply to this email directly, view it on GitHub
https://github.com/ReactWindows/react-native-windows/issues/478#issuecomment-228067942,
or mute the thread
https://github.com/notifications/unsubscribe/APy2bM58fVCmZHb_oBZI9h5FrHgqyxO8ks5qOphQgaJpZM4I2jln
.

[mowi22]

@abhivijay96 the screen on the phone hasn't changed from what I've posted above. I get that each time I deploy after launch.

[abhivijay96]

Please switch off mobile data in the phone and give it a try.
On 23-Jun-2016 8:25 pm, "mowi22" [email protected] wrote:

@abhivijay96 https://github.com/abhivijay96 the screen on the phone
hasn't changed from what I've posted above. I get that each time I deploy
after launch.

—
You are receiving this because you were mentioned.
Reply to this email directly, view it on GitHub
https://github.com/ReactWindows/react-native-windows/issues/478#issuecomment-228076265,
or mute the thread
https://github.com/notifications/unsubscribe/APy2bN_DDZfQ45GWIQbRgfqzJW1TEkLDks5qOp5UgaJpZM4I2jln
.

[mowi22]

@abhivijay96 Im getting the same. I've gone back through, started and restarted the server and switching to the IP with the data off,still the same error.

[abhivijay96]

Can you please try to connect to that address and port from a browser
outside VM .
On 23-Jun-2016 8:52 pm, "mowi22" [email protected] wrote:

@abhivijay96 https://github.com/abhivijay96 Im getting the same. I've
gone back through, started and restarted the server and switching to the IP
with the data off,still the same error.

—
You are receiving this because you were mentioned.
Reply to this email directly, view it on GitHub
https://github.com/ReactWindows/react-native-windows/issues/478#issuecomment-228085579,
or mute the thread
https://github.com/notifications/unsubscribe/APy2bD83kV9dhVzEN-oM9voow15w8m7Eks5qOqS0gaJpZM4I2jln
.

[mowi22]

@abhivijay96 Ok, I'm getting "Cannot GET /" in the browser outside the VM when I hit that IP and port.(lost as to what that means)

[abhivijay96]

So, the address is right, the problem occurs when the phone tries to
connect to the development server , do you have to declare any permissions
to use Internet in Windows phone ? Please check that
On 23-Jun-2016 10:33 pm, "mowi22" [email protected] wrote:

@abhivijay96 https://github.com/abhivijay96 Ok, I'm getting Cannot GET
/ in the browser outside the VM when I hit that IP and port.(lost as to
what that means)

—
You are receiving this because you were mentioned.
Reply to this email directly, view it on GitHub
https://github.com/ReactWindows/react-native-windows/issues/478#issuecomment-228115564,
or mute the thread
https://github.com/notifications/unsubscribe/APy2bI2WoT2x30dXvFpGn7gj-ZPRX39Pks5qOrxxgaJpZM4I2jln
.

[mowi22]

@abhivijay96 no, I got my windows 10 phone right out of the box and started working on this. :) I don't have anything restricting its use. I've been able to do just about everything else with the device. The Device portal is working just fine and I'm am able to browse. Not sure whats causing the mix up here.

[rozele]

@chukcha-wtf can you check your build output folder and make sure that index.windows.bundle has been copied properly?

[rozele]

@mowi22 you said you're getting "Cannot GET /" in the browser outside the VM. Did you try to hit this endpoint from the device itself? You may need to open up your Windows Firewall settings to make sure port 8080 is reachable from other devices / machines.

Also, http://ipaddress:8081/status should return the string "packager-status:running".

[mowi22]

@rozele Ok, I tried with my iphone and got the same "cannot get /" on my mac (outside the VM), android browser and iphone browser.

However, on the edge browser in the vm and the windows phone browser I get a 404 error message.

Every time I hit that endpoint with any device it gets logged back, with the IP, to the React package manager prompt, with "404 13". Which I gathered meant that its at least hitting that port.

I wasn't absolutely sure so I ran a port scanner from the windows phone and its indeed open on the 8081 port of my react packager server.

They all came back with "packager-status:running"

[abhivijay96]

https://msdn.microsoft.com/en-us/windows/uwp/packaging/app-capability-declarations

Please follow this link.
On 24-Jun-2016 4:09 am, "mowi22" [email protected] wrote:

@rozele https://github.com/rozele Ok, I tried with my iphone and got
the same "cannot get /" on my mac (outside the VM), android browser and
iphone browser.

However, on the edge browser in the vm and the windows phone I get a 404
error message.

Every time I hit that endpoint with any device it gets logged back with
the IP of the React package manager prompt, with "404 13". Which I gathered
meant that its at least hitting that port.

I wasn't absolutely sure so I rant a port scanner and its indeed it its
open on the 8081 port of my react packager server.

—
You are receiving this because you were mentioned.
Reply to this email directly, view it on GitHub
https://github.com/ReactWindows/react-native-windows/issues/478#issuecomment-228207109,
or mute the thread
https://github.com/notifications/unsubscribe/APy2bJckCueFRAZrJSMwQwFYohXfUEv7ks5qOwskgaJpZM4I2jln
.

[mowi22]

Compatibility changes haven't gotten me anywhere. Any other suggestions on this? I'm ordering another windows device to rule that out. Currently using (Alcartel Windows 10 Device). I've switched my environment to see if that was the problem, but I'm getting the same result. Deploys correctly to windows simulator. I'm hoping to test on an actual device. Ill report back then.

[andrewwebber]

After changing "project\node_modulesreact-native-windows\ReactWindows\ReactNative\DevSupport\DevInternalSettings.cs" this worked for me.

Now im trying to find out how to start the "dev menu" on a physical device as shake does not work.

c# public string DebugServerHost { get { return "172.20.15.142:8081"; //return GetSetting(DebugServerHostKey, default(string)); } set { SetSetting(DebugServerHostKey, value); } }

More elegant is changing ReactNative.DevSupport.DevServerHelper.DeviceLocalhost

[rozele]

@andrewwebber shake should be working on physical devices:
https://github.com/ReactWindows/react-native-windows/blob/master/ReactWindows/ReactNative/DevSupport/DevSupportManager.cs#L455

The dev menu is only available on debug builds.

[andrewwebber]

@rozele with the greatest respect you would laugh if you knew how much I've been shaking this Lumia 640XLDS

Still much love for the project though...

[rozele]

I definitely believe you, just sounds like a bug with the shake detector. A while ago, we were having problems with the shake detection on some devices so we switched to a custom shake detector:
https://github.com/ReactWindows/react-native-windows/blob/master/ReactWindows/ReactNative/DevSupport/ShakeAccelerometer.cs

Any chance you could through in some debugging statements to see what (if any) readings you are getting off the accelerometer? It may be a good time to look into switching back to the UWP built-in shake detector (Windows.Devices.Sensors.Accelerometer.Shaken event).

[rozele]

Also, I am able to get the Shaken event to fire on my SurfaceBook for desktop apps! Very strange that it's not working on the Lumia 640.

_Update_: Windows.Devices.Sensors.Accelerometer.Shaken does not fire on my SurfaceBook, but the custom ShakeAccelerometer does.

[andrewwebber]

@rozele i will investigate... as a work around i am just changing the dev settings and enabling hot reloading.

[rozele]

@andrewwebber: I'm also trying to create a Dev Settings page so you can customize the localhost address from within the app (similar to how its done for iOS and Android). This, of course, will not help you if you can't get the shake menu working
https://github.com/ReactWindows/react-native-windows/issues/358

[andrewwebber]

@rozele For me it would not be a show stopper as some of the settings could be set host side. Sometimes its kinda annoying (iOS, Android) to try to enter remote ip addresses etc on the phone, so me settings this value in the editor at the moment is not a big show stopper.

The only issue I am having is modules that some npm modules fail to run on windows like "uuid" as some modules don't exist (Again I am probably doing something stupid or missing something). But I will probably create a seperate issue once i have confirmed this.

var rb = require('crypto').randomBytes;
module.exports = function() {
  return rb(16);
};

[rozele]

@andrewwebber what version of npm are you running? People have had trouble with NPM modules not being installed when they were running NPM 2.x

[andrewwebber]

@rozele NPM 3.10.3 NODE v6.4.0

[ndbroadbent]

I'm also getting this when I try to start the emulator from Visual Studio. It works fine when I run react-native run-windows, but that's running the desktop app.

I have started the development server with react-native start. It seems like the emulator doesn't know how to connect to it.

[Hirurgo]

In UWP by default you can't connect to localhost ip address for security reasons, but windows have a list with apps approved to connect to localhost

Check this https://docs.microsoft.com/en-us/windows/iot-core/develop-your-app/loopback

P.S. In our project we had problems with loading JS bundle, solved this be by clearing loopback list and add our "package family name" to it again.

[AliAttariBhai]

please solution this