Can't load Gaussian Splat into React project

Hello, I am a first time user and running into an issue while trying to load a Gaussian splat into my scene in a React project.

To reproduce (also I provide a StackBlitz)

  1. I just cloned the latest Vite + React + Typescript starter repo
  2. added the boilerplate / starter-code from this guide: Babylon.js docs
  3. added the mesh loader line from this example: https://playground.babylonjs.com/#M05L0C#1
  4. The mesh is not visible in the scene, and I get the following console error:

Full repro here: Vitejs - Vite (forked) - StackBlitz

Has anyone got gaussian splatting working with React, or know what may be causing this error? Thank you

cc @Cedric

Babylon.js loaders are needed to load splats and it’s missing from package.json.

1 Like

Thanks, I tried adding the loaders in the Stackblitz, however I get the same error.

I still get RuntimeError: Unable to load from https://raw.githubusercontent.com/CedricGuillemet/dump/master/racoonfamily.spz: importMesh of undefined from undefined version: undefined, exporter version: undefinedimportMesh has failed JSON parse

(package.json: Vitejs - Vite (forked) - StackBlitz)

You should register the builtin loaders before load the model (preferably in App.tsx):

import { registerBuiltInLoaders } from "@babylonjs/loaders/dynamic";
...
registerBuiltInLoaders();

“This will register all supported loaders, but internally uses dynamic imports to only download/load a specific importer (e.g. glTF, splat, etc.) when a model of that type is first loaded.” Taken from here:


As side note, keep update to the same version both @babylonjs/core and @babylonjs/loaders otherwise you will get compilation errors if you install for the first time the dependencies declared in the existing package-lock.json.

1 Like

import { registerBuiltInLoaders } from “@babylonjs/loaders/dynamic”;
…
registerBuiltInLoaders();

That fixed it for me, thank you! And good to know about the package versions.

1 Like