BabylonReactNative: no 3D view on Windows

Hi there!
Continuing my experiments with BabylonJS for ReactNative :slight_smile:

I’m using the sample code from Playground 0.65 from the BabylonReactNative GitHub repo (main branch). The app builds and runs smoothly on Android and iOS :+1:

I’m trying to run on Windows 10 as well. The app seems to builds properly but there is no render view at runtime:

I’ve tried building 32 bits and 64 bits, always with the release configuration.

And I’ve tried with 2 different packages versions:

    "@babylonjs/core": "^5.0.0-alpha.65",
    "@babylonjs/loaders": "^5.0.0-alpha.65",
    "@babylonjs/react-native": "^0.65.0-alpha.47",
    "@react-native-community/slider": "^4.2.1",
    "react": "17.0.2",
    "react-native": "0.65.2"
    "react-native-windows": "0.65.12"


    "@babylonjs/core": "^5.0.0-rc.3",
    "@babylonjs/loaders": "^5.0.0-rc.3",
    "@babylonjs/react-native": "^0.65.0-alpha.48",
    "@react-native-community/slider": "^4.2.1",
    "react": "17.0.2",
    "react-native": "0.65.2",
    "react-native-windows": "0.65.12"


I’ve tried in debug, when running from the command line with:

npx react-native run-windows

I get a message saying that Babylon Native doesn’t run in debug mode.
I understand that I need to run in release mode, but this shows that the app is at least trying to render when running in debug.

I’ve also noticed the sample app doesn’t support Windows dark mode. This is what I get with dark mode on (the default on all my machines):

May be I need to use a different version of the BabylonReactNative package to get it to work?
Thank you for help!

cc @srzerbetto

@obasille , the support for windows is currently experimental. However, some of our team member have successfully run it from the github repo.

I will try to create a sample project to repro the results you are getting.

Thanks @srzerbetto!
Here is my project. (413.0 KB)

Thanks @obasille , this will be very useful!

@obasille , are you using the package @babylonjs/react-native-windows ?

Can you try adding that to your project?

1 Like

Oh… I didn’t realized that there was a windows specific package, although with hindsight it seems kind of obvious!

Thank you for pointing that out, it’s working now!

As a note, I had to install it with “–force” because it’s using version 3 of react-native-permissions whereas @babylonjs/react-native@0.65.0-alpha.48 is on version 2.

Note: for future readers, just be sure to install react-native-windows with a version matching @babylonjs/react-native

Just as on update @obasille , we are aware of this react-native-permissions problem and we are working on a fix for it right now. I’m glad you were able to make it work!


Hi @obasille

I managed to get it to work. I’ve updated the GitHub issue with some infos : 3D View not been rendered when using windows npm package · Issue #364 · BabylonJS/BabylonReactNative · GitHub

Let me know if it works for you.

BTW, the dark mode is not fixed.

Hi Cedric,
Thanks for your message. I’ve read the issue, I’m a bit confused, this about to be able to run with a debug build?
Because for the “no 3d view” initial problem, my mistake was that I didn’t added the @babylonjs/react-native-windows package.

Yes, but I always check and found an issue(that I fixed) on the way.

Thanks, I’ll give it a try!

1 Like

Hi @Cedric,
Just did some tests and I can run a release build with no issue.
For the debug build, I’ve edited app.cpp to disable the web debugger as you pointed out in the issue #364 and that got it running :slight_smile:

For reference:

    "dependencies": {
      "@babylonjs/core": "^5.1.0",
      "@babylonjs/loaders": "^5.1.0",
      "@babylonjs/react-native": "^1.0.1",
      "@babylonjs/react-native-windows-0-65": "^1.0.1",
      "@react-native-community/slider": "^4.2.1",
      "react": "17.0.2",
      "react-native": "0.65.2",
      "react-native-windows": "0.65.12"
1 Like