I am trying to add a dropdown of cameras to Sandbox. I do not know how to get running locally. Currently I have the repo cloned and using VSCode to run it. Other HTML tests work with file. But I have not tried TypeScript.
E:\Dev\Babylon\Babylon.js\packages\tools\sandbox\src>dir
Volume in drive E is X9 Pro
Volume Serial Number is 2E36-0C36
Directory of E:\Dev\Babylon\Babylon.js\packages\tools\sandbox\src
03/09/2026 04:16 PM <DIR> .
03/09/2026 04:16 PM <DIR> ..
03/09/2026 04:09 PM <DIR> .vscode
03/09/2026 03:57 PM <DIR> components
03/09/2026 03:57 PM 86 custom.d.ts
03/09/2026 03:57 PM 2,868 globalState.ts
03/09/2026 03:57 PM <DIR> img
03/09/2026 03:57 PM 28 index.ts
03/09/2026 03:57 PM <DIR> legacy
03/09/2026 03:57 PM 28,320 sandbox.tsx
03/09/2026 03:57 PM <DIR> scss
03/09/2026 03:57 PM <DIR> tools
4 File(s) 31,302 bytes
8 Dir(s) 977,354,883,072 bytes free
E:\Dev\Babylon\Babylon.js\packages\tools\sandbox\src>
And my .vscode launch.json is:
{
"version": "0.2.0",
"configurations": [
{
"type": "msedge",
"request": "launch",
"name": "localhost",
"file": "${workspaceFolder}/sandbox.tsx"
}
]
}
I am starting VSCode here: E:\Dev\Babylon\Babylon.js\packages\tools\sandbox\src
Microsoft Windows [Version 10.0.26200.7922]
(c) Microsoft Corporation. All rights reserved.
E:\Dev\Babylon\Babylon.js\packages\tools\sandbox\src>code .
Press F5 get the following text displayed in a new Microsoft Edge Browser:
File [sandbox.tsx](file:///E:/Dev/Babylon/Babylon.js/packages/tools/sandbox/src/sandbox.tsx)
Along with the TypeScript:
import * as React from "react";
import { createRoot } from "react-dom/client";
import { GlobalState } from "./globalState";
import { RenderingZone } from "./components/renderingZone";
import { ReflectorZone } from "./components/reflectorZone";
import { Footer } from "./components/footer";
import { WelcomeDialog } from "./components/welcomeDialog";
import { LocalStorageHelper } from "./tools/localStorageHelper";
import { EnvironmentTools } from "./tools/environmentTools";
import { Vector3 } from "core/Maths/math.vector";
import { Deferred } from "core/Misc/deferred";
import type { Scene } from "core/scene";
import { CreateScreenshotAsync } from "core/Misc/screenshotTools";
import type { IScreenshotSize } from "core/Misc/interfaces/screenshotSize";
import { Color3, Color4 } from "core/Maths/math";
import { FilesInputStore } from "core/Misc/filesInputStore";
import "./scss/main.scss";
import fullScreenLogo from "./img/logo-fullscreen.svg";
import type { AbstractEngine } from "core/Engines/abstractEngine";
import { ImageProcessingConfiguration } from "core/Materials/imageProcessingConfiguration";
declare const BABYLON: typeof import("core/index");
