[React] is it possible to load 3d model from src folder?

Questions
1

Hello, Community!

I’m working on a project envolving Babylon and React.
I have managed to load all models from the public folder using the Javascript function:

SceneLoader.ImportMeshAsync( “modelName”, “/aFolderInPublic/”, “modelName.babylon”, scene);

Going foward we would like to have the 3d models placed somewhere in the “scr/Components/”.

While attempting to do it, I’m facing an error along these lines:

Uncaught (in promise) RuntimeError:
Unable to load from src/Components/modelName.babylon: importMesh of undefined from undefined version: undefined, exporter version: undefinedimportMesh has failed JSON parse

It’s definitely a React thing…
Have yet to find a solution so decide to drop this question here…

Thanks.

2

You just need to make sure to host the .babylon file in a public folder, right next to your images and other binary assets. not in the sources folder, but the public or static folder.

3 Likes
3

Good thing I came here :slight_smile:

Thank you very much.

1 Like
4

Hi again!
I found it is actually possible…
And since everyone is so kind to helping me,

Here’s how:

On the top of a React module.js you can:

import “anyNameWorks” from “./babylonFileName.babylon”

then in your code you can:

var fileName = Tools.GetFilename(anyNameWorks);
var filePath = Tools.GetFolderPath(anyNameWorks);

SceneLoader.ImportMeshAsync( “nameOfTheMeshYouAreLookingFor”, filePath, fileName, scene);

And… you can have several different meshes inside that file.

Hope that helps anyone trying to achieve this :slight_smile:

5

Just want to add - this very much depends on the packer you are using and how you serve your solution. I am glad you found a solution that fits your needs :slight_smile:

1 Like
6

Interesting.
Although we might place the files in “/src/”, they end up in “/static/media/”.