Hi~!
I have been trying to use Babylon on the server-side with TypeScript + Node.js
I have successfully rendered using node-based canvas with .babylon 3D model.
However, when trying to load .gltf 3D model, it keeps saying Unable to find a plugin to load undefined files.
const BBJS = require('babylonjs')
import "@babylonjs/loaders";
import "@babylonjs/core";
// import { SceneLoader } from '@babylonjs/core';
// above commented import will be used later in an example. //
export class ModelSceneBuilder {
protected canvas: any;
protected engine: any;
protected scene: any;
protected camera: any;
constructor(canvas:any) {
this.canvas = canvas;
}
async init() {
this.engine = new BBJS.Engine(this.canvas, true, { preserveDrawingBuffer: true, stencil: true })
this.scene = new BBJS.Scene(this.engine)
this.camera = new BBJS.FreeCamera('cam1', new BBJS.Vector3(10, 15, -20), this.scene)
this.camera.setTarget(BBJS.Vector3.Zero())
this.camera.attachControl(this.canvas, false)
const sphere = BBJS.Mesh.CreateSphere('sphere1', 16, 2, this.scene, false, BBJS.Mesh.FRONTSIDE);
this.engine.runRenderLoop(() => {
this.scene.render()
})
}
async loadModel(rootURL:string, fileName:string) {
const isPlugInAvailable = BBJS.SceneLoader.IsPluginForExtensionAvailable(".gltf")
console.log(`Plugin Availability For GLTF ==== ${isPlugInAvailable} ====`);
BBJS.SceneLoader.ImportMesh('', rootURL, fileName, this.scene, null)
}
}
With import "@babylonjs/loaders"; or even import "@babylonjs/loaders/GLTF"; , I still get this error message
Babylon.js v4.2.0 - WebGL1
Plugin Availability For GLTF ====> false
BJS - [09:38:48]: Unable to find a plugin to load .gltf files. Trying to use .babylon default plugin.
For some reason, when I use a separate import for the SceneLoader like this
import { SceneLoader } from '@babylonjs/core';
...
...
async loadModel(rootURL:string, fileName:string) {
const isPlugInAvailable = SceneLoader.IsPluginForExtensionAvailable(".gltf")
console.log('Plugin Availability For GLTF ====>', isPlugInAvailable);
SceneLoader.ImportMesh('', rootURL, fileName, this.scene, null)
}
I finally get true for gltf plugin availability check, throws some other error message
Babylon.js v4.2.0 - WebGL1
Plugin Availability For GLTF ====> true
-=-on server error-=- ReferenceError: indexedDB is not defined
at new Database (webpack-internal:///./node_modules/@babylonjs/core/Offline/database.js:40:41)
at Function._Engines_engine__WEBPACK_IMPORTED_MODULE_3__.Engine.OfflineProviderFactory (webpack-internal:///./node_modules/@babylonjs/core/Offline/database.js:23:12)
at Function.SceneLoader._LoadData (webpack-internal:///./node_modules/@babylonjs/core/Loading/sceneLoader.js:218:93)
at Function.SceneLoader.ImportMesh (webpack-internal:///./node_modules/@babylonjs/core/Loading/sceneLoader.js:370:28)
Could all these be an issue caused by the way next.js, npm, typescript, etc. are set up in my project?
