# Error: Cannot load cubemap because 6 files were not defined

**URL:** <https://forum.babylonjs.com/t/error-cannot-load-cubemap-because-6-files-were-not-defined/24852>\
**Category:** Questions\
**Tags:** react, material\
**Created:** [October 27, 2021, 8:35pm UTC](https://forum.babylonjs.com/t/error-cannot-load-cubemap-because-6-files-were-not-defined/24852 "2021-10-27T20:35:50Z")\
**Posts on this page:** 20\
**Page:** 1

<div class="post-metadata">

**Author:** ![igorroman777](https://avatars.discourse-cdn.com/v4/letter/i/b4bc9f/32.png) [@igorroman777](https://forum.babylonjs.com/u/igorroman777)\
**Post date:** [October 27, 2021, 8:35pm UTC](https://forum.babylonjs.com/t/error-cannot-load-cubemap-because-6-files-were-not-defined/24852/1 "2021-10-27T20:35:50Z")

</div>

I have a problem.  
I make my app on android and babylon.js react native:

```auto
    "@babylonjs/core": "5.0.0-alpha.57",
    "@babylonjs/loaders": "5.0.0-alpha.57",
    "@babylonjs/react-native": "0.4.0-alpha.39",
    "@expo/vector-icons": "12.0.5",

```

I import glb-fie with PBRMatarial for Reflections. This Reflections works well in sandbox.

But in the app Reflections does not work anymore. I am trying this:

```auto
import '@babylonjs/core/Materials/Textures/Loaders/ddsTextureLoader';
import "@babylonjs/core/Meshes/meshBuilder";
import '@babylonjs/core/Materials/standardMaterial';
import "@babylonjs/loaders/glTF";
...

scene.createDefaultEnvironment();

```

But I get the:

```auto
 LOG BJS - [22:24:58]: Babylon Native (v5.0.0-alpha.57) launched
 ERROR Error: Cannot load cubemap because 6 files were not defined

```

---

<div class="post-metadata">

**Author:** ![PirateJC](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/piratejc/32/1003_2.png) [@PirateJC](https://forum.babylonjs.com/u/PirateJC)\
**Post date:** [October 27, 2021, 9:00pm UTC](https://forum.babylonjs.com/t/error-cannot-load-cubemap-because-6-files-were-not-defined/24852/2 "2021-10-27T21:00:29Z")

</div>

Hey @igorroman777

It’s always most helpful if you can provide a playground for us to look at it. It is very difficult to help troubleshoot without one.

That said, please check out this thread and see if it helps:

> [@How to make model lighting/pre-processing in code the same as how a model appears in the sandbox?](https://forum.babylonjs.com/t/how-to-make-model-lighting-pre-processing-in-code-the-same-as-how-a-model-appears-in-the-sandbox/17772/11):
>
> Well I’m now second-guessing if that’s actually the problem that’s remaining. It seems to me like something goofy is happening with the textures on the model itself. Here’s the underside of your model in the sandbox: I see the same thing in the playground. That leads me to believe that perhaps the normals are facing the wrong way on your model. If we’re looking at the wrong sides of your models, that COULD explain why it’s not appearing correctly. Kinda just guessing, but it seems …

Also this doc page should help as well as it talks about skyboxes and the 6 cube faces needed to create one:

> **[Skyboxes | Babylon.js Documentation](https://doc.babylonjs.com/features/featuresDeepDive/environment/skybox)**
>
> Learn how to add a skybox to your Babylon.js scene.

---

<div class="post-metadata">

**Author:** ![sebavan](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/sebavan/32/57_2.png) [@sebavan](https://forum.babylonjs.com/u/sebavan)\
**Post date:** [October 27, 2021, 9:03pm UTC](https://forum.babylonjs.com/t/error-cannot-load-cubemap-because-6-files-were-not-defined/24852/3 "2021-10-27T21:03:07Z")

</div>

You d need to add the support for env texture and for the helper function I guess:

```auto
import '@babylonjs/core/Materials/Textures/Loaders/envTextureLoader';
import '@babylonjs/core/Helpers/sceneHelpers ';

```

which is strange as env loader should be imported already by sceneHelpers 🙂

Let s see if @RaananW has any other thoughts.

---

<div class="post-metadata">

**Author:** ![igorroman777](https://avatars.discourse-cdn.com/v4/letter/i/b4bc9f/32.png) [@igorroman777](https://forum.babylonjs.com/u/igorroman777)\
**Post date:** [October 28, 2021, 7:22am UTC](https://forum.babylonjs.com/t/error-cannot-load-cubemap-because-6-files-were-not-defined/24852/5 "2021-10-28T07:22:12Z")

</div>

@sebavan @RaananW  
unfortunately, that didn’t help. The problem has remained:

```auto
 ERROR Error: Cannot load cubemap because 6 files were not defined

```

---

<div class="post-metadata">

**Author:** ![RaananW](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/raananw/32/28955_2.png) [@RaananW](https://forum.babylonjs.com/u/RaananW)\
**Post date:** [October 28, 2021, 9:05am UTC](https://forum.babylonjs.com/t/error-cannot-load-cubemap-because-6-files-were-not-defined/24852/6 "2021-10-28T09:05:32Z")

</div>

This specific error is only present when using the native engine. ~~Are you using babylon native to compile your code?~~ Sorry, should have read from the beginning - yes you are.

@bghgary - is there any reason you can see that this could happen? This error is called in `createCubeTexture` of the native engine if there are no files defined, but the `createDefaultEnvironment` should provide the file (URL) needed for it to work.

---

<div class="post-metadata">

**Author:** ![igorroman777](https://avatars.discourse-cdn.com/v4/letter/i/b4bc9f/32.png) [@igorroman777](https://forum.babylonjs.com/u/igorroman777)\
**Post date:** [October 28, 2021, 11:05am UTC](https://forum.babylonjs.com/t/error-cannot-load-cubemap-because-6-files-were-not-defined/24852/7 "2021-10-28T11:05:40Z")

</div>

> [@RaananW](#):
>
> createDefaultEnvironment

I have tried like this:

```auto

      // Add the environment manually, instead of createDefaultEnvironment function- use Image tag
      const envTexture = CubeTexture.CreateFromPrefilteredData('https://playground.babylonjs.com/textures/environment.dds', scene);
      envTexture.name = "envTex";
      envTexture.gammaSpace = false;
      scene.environmentTexture = envTexture;

```

unfortunately, that didn’t help. The problem has remained.

---

<div class="post-metadata">

**Author:** ![RaananW](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/raananw/32/28955_2.png) [@RaananW](https://forum.babylonjs.com/u/RaananW)\
**Post date:** [October 28, 2021, 12:15pm UTC](https://forum.babylonjs.com/t/error-cannot-load-cubemap-because-6-files-were-not-defined/24852/8 "2021-10-28T12:15:38Z")

</div>

I don’t think it is your issue, I think it is more an issue with how babylon native is analyzing the file provided. But I might be wrong.  
I am sure @bghgary can shed some light on that when he is available later today.

---

<div class="post-metadata">

**Author:** ![bghgary](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/bghgary/32/48532_2.png) [@bghgary](https://forum.babylonjs.com/u/bghgary)\
**Post date:** [October 28, 2021, 8:46pm UTC](https://forum.babylonjs.com/t/error-cannot-load-cubemap-because-6-files-were-not-defined/24852/9 "2021-10-28T20:46:21Z")

</div>

Unfortunately, we don’t have the code path for creating skyboxes working yet. By default, creating the environment will create a skybox. If you disable that, then it will work.

```auto
scene.createDefaultEnvironment({ createSkybox: false });

```

---

<div class="post-metadata">

**Author:** ![igorroman777](https://avatars.discourse-cdn.com/v4/letter/i/b4bc9f/32.png) [@igorroman777](https://forum.babylonjs.com/u/igorroman777)\
**Post date:** [October 30, 2021, 6:14pm UTC](https://forum.babylonjs.com/t/error-cannot-load-cubemap-because-6-files-were-not-defined/24852/10 "2021-10-30T18:14:03Z")

</div>

> [@bghgary](#):
>
> Unfortunately, we don’t have the code path for creating skyboxes working yet. By default, creating the environment will create a skybox. If you disable that, then it will work.

Yes, there is no error. But glb model is no longer shown.

And that doesn’t work for react native:

```
pbr.environmentTexture = BABYLON.CubeTexture.CreateFromPrefilteredData("/textures/environment.dds", scene);
pbr.metallicRoughnessTexture = new BABYLON.Texture("/textures/mr.jpg", scene);

```

---

<div class="post-metadata">

**Author:** ![igorroman777](https://avatars.discourse-cdn.com/v4/letter/i/b4bc9f/32.png) [@igorroman777](https://forum.babylonjs.com/u/igorroman777)\
**Post date:** [October 30, 2021, 7:24pm UTC](https://forum.babylonjs.com/t/error-cannot-load-cubemap-because-6-files-were-not-defined/24852/11 "2021-10-30T19:24:15Z")

</div>

> [@igorroman777](#):
>
> `CreateFromPrefilteredData`

@sebavan @bghgary  
how to show the reflection for baybylonjs react native?

---

<div class="post-metadata">

**Author:** ![bghgary](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/bghgary/32/48532_2.png) [@bghgary](https://forum.babylonjs.com/u/bghgary)\
**Post date:** [October 30, 2021, 10:30pm UTC](https://forum.babylonjs.com/t/error-cannot-load-cubemap-because-6-files-were-not-defined/24852/12 "2021-10-30T22:30:22Z")

</div>

If you use the `.env` format, it should work. Other formats are not supported yet.

---

<div class="post-metadata">

**Author:** ![igorroman777](https://avatars.discourse-cdn.com/v4/letter/i/b4bc9f/32.png) [@igorroman777](https://forum.babylonjs.com/u/igorroman777)\
**Post date:** [October 31, 2021, 7:20am UTC](https://forum.babylonjs.com/t/error-cannot-load-cubemap-because-6-files-were-not-defined/24852/13 "2021-10-31T07:20:26Z")

</div>

@bghgary @sebavan

The code has the same effect as createSkybox: false:  
It runs without errors, but the GLB model is not shown.

```auto

      // scene.createDefaultEnvironment({ createSkybox: false });

      // // Add the environment manually, instead of createDefaultEnvironment function- use Image tag
      const envTexture = CubeTexture.CreateFromPrefilteredData('https://playground.babylonjs.com/textures/environment.env', scene);
      //const envTexture = CubeTexture.CreateFromPrefilteredData("app:///textures/environment.env", scene);
      envTexture.name = "envTex";
      envTexture.gammaSpace = false;
      scene.environmentTexture = envTexture;

```

---

<div class="post-metadata">

**Author:** ![bghgary](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/bghgary/32/48532_2.png) [@bghgary](https://forum.babylonjs.com/u/bghgary)\
**Post date:** [November 1, 2021, 5:15pm UTC](https://forum.babylonjs.com/t/error-cannot-load-cubemap-because-6-files-were-not-defined/24852/14 "2021-11-01T17:15:24Z")

</div>

This is working for me on Windows. Can you show more of your code or somehow give me a repro? Let me try this on Android.

---

<div class="post-metadata">

**Author:** ![igorroman777](https://avatars.discourse-cdn.com/v4/letter/i/b4bc9f/32.png) [@igorroman777](https://forum.babylonjs.com/u/igorroman777)\
**Post date:** [November 1, 2021, 5:35pm UTC](https://forum.babylonjs.com/t/error-cannot-load-cubemap-because-6-files-were-not-defined/24852/15 "2021-11-01T17:35:50Z")

</div>

> [@bghgary](#):
>
> me try this on Android.

```auto
import { ShadowGenerator, StandardMaterial, CubicEase, EasingFunction, Animation, ScreenSpaceReflectionPostProcess } from '@babylonjs/core';
import { Texture } from '@babylonjs/core/Materials/Textures/texture';
import { CubeTexture } from '@babylonjs/core/Materials/Textures/cubeTexture';
import '@babylonjs/core/Materials/Textures/Loaders/ddsTextureLoader';
import '@babylonjs/core/Materials/Textures/Loaders/envTextureLoader';
import '@babylonjs/core/Helpers/sceneHelpers';

import "@babylonjs/core/Meshes/meshBuilder";
import '@babylonjs/core/Materials/standardMaterial';

// for compressed glb files
import '@babylonjs/loaders/glTF/2.0/Extensions/KHR_draco_mesh_compression';
import "@babylonjs/loaders/glTF";

  function importMesh(scene: Scene) {
    const modelsUrl = "app:///models/";
    const glbFile = "gallery/gallery_new2.glb";

    SceneLoader.ImportMeshAsync(null, modelsUrl, glbFile, scene).then(result => {

        scene.createDefaultEnvironment({ createSkybox: false });

}}

 useEffect(() => {
    if (engine) {
      const scene = new Scene(engine);
      setScene(scene);

      var camera = new FreeCamera("freeCamera", camStartPosition, scene);
      camera.setTarget(camTarget);
      scene.activeCamera = camera;
      setCamera(scene.activeCamera!);      
       var light = new HemisphericLight("light", new Vector3(1, 3, 1), scene);

      // Default intensity is 1. Let's dim the light a small amount
      light.intensity = Properties.scene.light.intensity
      setLight(light);

      scene.executeWhenReady(function(){
        setCameraDefault();
      });

      importMesh(scene);

    }
  }, [engine]);

```

---

<div class="post-metadata">

**Author:** ![bghgary](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/bghgary/32/48532_2.png) [@bghgary](https://forum.babylonjs.com/u/bghgary)\
**Post date:** [November 1, 2021, 7:00pm UTC](https://forum.babylonjs.com/t/error-cannot-load-cubemap-because-6-files-were-not-defined/24852/16 "2021-11-01T19:00:58Z")

</div>

Hmm, it’s working fine in Babylon Native directly. Android works too.

 ![image](https://us1.discourse-cdn.com/flex024/uploads/babylonjs/original/3X/c/d/cd8961799487c584bca466716c94e466fbce123d.jpeg)

Let me try Babylon React Native.

---

<div class="post-metadata">

**Author:** ![bghgary](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/bghgary/32/48532_2.png) [@bghgary](https://forum.babylonjs.com/u/bghgary)\
**Post date:** [November 1, 2021, 7:01pm UTC](https://forum.babylonjs.com/t/error-cannot-load-cubemap-because-6-files-were-not-defined/24852/17 "2021-11-01T19:01:39Z")

</div>

Are you sure the camera is pointing at the object?

---

<div class="post-metadata">

**Author:** ![igorroman777](https://avatars.discourse-cdn.com/v4/letter/i/b4bc9f/32.png) [@igorroman777](https://forum.babylonjs.com/u/igorroman777)\
**Post date:** [November 1, 2021, 9:20pm UTC](https://forum.babylonjs.com/t/error-cannot-load-cubemap-because-6-files-were-not-defined/24852/18 "2021-11-01T21:20:25Z")

</div>

Without scene.createDefaultEnvironment({ createSkybox: false });  
glb model is shown  
can you show me your code?

```auto
     const camStartPosition = new Vector3(-3, 0.1, 0);
     const camTarget = new Vector3(10, 0.1, 0);

      var camera = new FreeCamera("freeCamera", camStartPosition, scene);
      camera.setTarget(camTarget);
      scene.activeCamera = camera;
      setCamera(scene.activeCamera!);

```

---

<div class="post-metadata">

**Author:** ![bghgary](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/bghgary/32/48532_2.png) [@bghgary](https://forum.babylonjs.com/u/bghgary)\
**Post date:** [November 2, 2021, 12:42am UTC](https://forum.babylonjs.com/t/error-cannot-load-cubemap-because-6-files-were-not-defined/24852/21 "2021-11-02T00:42:41Z")

</div>

> [@igorroman777](#):
>
> ```auto
> function importMesh(scene: Scene) {
> const modelsUrl = "app:///models/";
> const glbFile = "gallery/gallery_new2.glb";
> 
> SceneLoader.ImportMeshAsync(null, modelsUrl, glbFile, scene).then(result => {
> 
> scene.createDefaultEnvironment({ createSkybox: false });
> 
> }}
> 
> ```

This code is missing a ending parenthesis for the `.then` continuation. Is this what is actually in your code?

---

<div class="post-metadata">

**Author:** ![igorroman777](https://avatars.discourse-cdn.com/v4/letter/i/b4bc9f/32.png) [@igorroman777](https://forum.babylonjs.com/u/igorroman777)\
**Post date:** [November 2, 2021, 8:32am UTC](https://forum.babylonjs.com/t/error-cannot-load-cubemap-because-6-files-were-not-defined/24852/22 "2021-11-02T08:32:50Z")

</div>

my Code is:

```auto
function importMesh(scene: Scene) {
    const modelsUrl = "app:///models/";
    const glbFile = "gallery/gallery_new2.glb";

    SceneLoader.ImportMeshAsync(null, modelsUrl, glbFile, scene).then(result => {
      result.meshes[0].position.y = - 1.0;
      const mesh = result.meshes[0];
  
      _fetchAndScaleImages(scene, scalePicture);
      props.onSpaceDisplayed();

      scene.createDefaultEnvironment({ createSkybox: false });
    });
  }

```

---

<div class="post-metadata">

**Author:** ![bghgary](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/bghgary/32/48532_2.png) [@bghgary](https://forum.babylonjs.com/u/bghgary)\
**Post date:** [November 2, 2021, 4:23pm UTC](https://forum.babylonjs.com/t/error-cannot-load-cubemap-because-6-files-were-not-defined/24852/23 "2021-11-02T16:23:31Z")

</div>

Okay, I tried this in the default Playground app for BabylonReactNative on Android and added a line for the environment. Everything works fine.

```auto
      SceneLoader.ImportMeshAsync('', 'https://raw.githubusercontent.com/KhronosGroup/glTF-Sample-Models/master/2.0/BoxAnimated/glTF-Binary/BoxAnimated.glb').then(result => {
        scene.createDefaultEnvironment({createSkybox: false});
        const mesh = result.meshes[0];
        mesh.parent = transformContainer;
      });

```

Let’s rule out some more things. Can you try using the latest versions?

```auto
    "@babylonjs/core": "5.0.0-alpha.60",
    "@babylonjs/loaders": "5.0.0-alpha.60",
    "@babylonjs/react-native": "0.4.0-alpha.41",

```

If that still doesn’t work, can you provide a repo that reproduces this issue?

[Next page](https://forum.babylonjs.com/t/error-cannot-load-cubemap-because-6-files-were-not-defined/24852.md?page=2)
