WebXR and Typescript not matching up with tutorial

Questions
1

I’ve been following the babylon js documentation tutorial using typescript, and it’s been working like a dream. However when trying to enable XR functionality i encounter some issues.

Running this piece of code: const xr = await this._scene.createDefaultXRExperienceAsync({ floorMeshes: [this._ground], });
As suggested here works just fine, and enables VR and let’s me enter my world using a Quest 2. Good times!

However when trying anything that does not come out of babylon, but rather WebXR, following the continuation of the same tutorial here typescript no longer follows. When entering for example const sessionManager = new WebXRSessionManager(scene); i get a

Cannot find name ‘WebXRSessionManager’

This might no be super babylon specific, but just following the tutorial when using typescript has worked great up until this point, so I figured it should now as well. I’ve tried npm install --save-dev @types/webxr but that didn’t give me any of the types I seem to actually need.

Is it as easy as doing this with typescript is impossible? The reason I even bother asking is since babylon otherwise seems so very typescript friendly.

Cheers!

2

The babylon documentation assumes that you are importing the babylon closses using some form of an import mechanism (for example, import { WebXRSessionManager } from ..... If you are using the playground, you get all classes imported already, as part of the BABYLON namespace. so if you do that in the playground, you should use BABYLON.WebXRSessionManager.

This is not related to the underlying webxr, as those are babylon classes. Make sure it is imported and that it exists in your module, and you will be able to use it as you wish.

3

Thank you very much!

So what I have at the top of my file is
import * as BABYLON from 'babylonjs';

And since I didn’t understand these were Babylon modules, I didn’t put Babylon in front of them. Indeed what solved it was
const sessionManager = new BABYLON.WebXRSessionManager(this._scene);

1 Like