Import/Export Babylon objects (like scene) in different modules?

Is there a way to export/import objects like scene, camera etc in different files (js) without having to pass them as parameters?

The 3 JS files below is what I use now. I was wondering if there is a better way.

I am using vue and vuex if it matters, but a lot of the babylon code is seperate, which makes things a bit complicated for me.


export const render = () => {
    const canvas = document.getElementById('renderCanvas');
    const engine = new BABYLON.Engine(canvas, true);

    const scene = createScene(canvas, engine);
    engine.runRenderLoop(function() {

    window.addEventListener('resize', function() {


export const createScene = function(canvas, engine) {
    const scene = new BABYLON.Scene(engine),
        camera = resetZoom(canvas, scene),
        light = new BABYLON.HemisphericLight('light1', new BABYLON.Vector3(0,1,0), scene),
        ground = createGround(scene),
        axis = new BABYLON.Debug.AxesViewer();

    createFloorplan(scene, ground, camera, canvas);

    return scene;


export const createFloorplan = (scene, ground, camera, canvas) => {
    // Lots of code that uses all these parameters

Well you can always store them on window object (even though it is not a good idea to bloat it)

Thanks, that could be an option.

Is it a good idea to store them in Vuex also? (For anyone that knows about it)

1 Like