Hello.
I want to import a .obj file including .mtl and textures into my scene in my Angular TS app. I’d like to use the OBJFileLoader in @babylonjs/loaders for that. My current code roughly looks like this:
import {AfterViewInit, Component, ElementRef, NgZone, OnDestroy, ViewChild} from '@angular/core';
import type {
ArcRotateCamera,
ArcRotateCameraPointersInput,
Engine,
Scene,
StandardMaterial
} from "@babylonjs/core";
import {DesignerStateService} from "../../designer-state-service";
import {Vector3} from "@babylonjs/core/Maths/math.vector";
type Babylon = typeof import('@babylonjs/core');
@Component({
standalone: false,
styleUrl: './designer.component.css',
templateUrl: './designer.component.html'
})
export class DesignerComponent implements AfterViewInit, OnDestroy {
...
ngAfterViewInit(): void {
setTimeout(async () => {
const babylon = await import('@babylonjs/core');
const loaders = await import('@babylonjs/loaders');
const engine = new babylon.Engine(this.canvas.nativeElement);
const scene = new babylon.Scene(engine);
babylon.RegisterSceneLoaderPlugin(new loaders.OBJFileLoader());
await babylon.AppendSceneAsync("assets/designer/model.obj", scene);
engine.runRenderLoop(() => scene.render());
}, 0);
}
Unfortunately, already during “compile” time, I get:
X [ERROR] TS2307: Cannot find module '@babylonjs/core/Materials/PBR/openPbrMaterial.js' or its corresponding type declarations. [plugin angular-compiler]
node_modules/@babylonjs/loaders/glTF/2.0/glTFLoader.d.ts:8:37:
8 │ ...Material } from "@babylonjs/core/Materials/PBR/openPbrMaterial.js";
╵ ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
X [ERROR] TS2307: Cannot find module '@babylonjs/core/Materials/PBR/openPbrMaterial.js' or its corresponding type declarations. [plugin angular-compiler]
node_modules/@babylonjs/loaders/glTF/2.0/openPbrMaterialLoadingAdapter.d.ts:1:37:
1 │ ...Material } from "@babylonjs/core/Materials/PBR/openPbrMaterial.js";
╵ ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
Do you have any idea how to fix that?![]()