Magento 2 Require js

[Manijayabalan]

How to use BABYLON js in magento 2. Because if i use requirejs i get the following error

Uncaught TypeError: Cannot read property 'Engine' of undefined

script.js

[Guest]

Everything is here:

http://doc.babylonjs.com/features/npm_support

 

[brianzinn]

did you try requirejs(['babylonjs'], { ... });

[Manijayabalan]

1 hour ago, brianzinn said:

did you try requirejs(['babylonjs'], { ... });

Hi  brianzinn, Yes i use the following script

 requirejs(['babylonjs'], function(){
    var canvas = document.getElementById("render-canvas");
    var engine = new BABYLON.Engine(canvas);
});

[brianzinn]

I've never used magento.  actually, I was just correcting your 'babylon' to 'babylonjs'.  look like it's just require(['babylonjs'], {}... at least on an older version.
https://magento.stackexchange.com/questions/148985/use-require-config-js-to-load-files-needed-on-all-pages
looks like you need to setup a config

[salva]

var config = {
    map: {...},
    paths: {...},
    deps: [...],
    shim: {...},
    config: {
        mixins: {...},
        text: {...}
    }
}

 

Try this, OX SoftwareS is one of the best Magento Development Company in europe.

[The-Educator]

To use Babylon.js in Magento 2 with RequireJS and avoid the "Cannot read property 'Engine' of undefined" error:

1. Download Babylon.js: Get Babylon.js from its website or use a CDN link.

2. Include Babylon.js: Put the Babylon.js file (like babylon.js or babylon.max.js) in your Magento 2 project, such as app/design/frontend/YourTheme/js.

3. Configure RequireJS: Set up RequireJS to load Babylon.js correctly. Here’s a basic setup:

// Edit or create a RequireJS configuration file (e.g., requirejs-config.js)
var config = {
    paths: {
        'babylon': 'YourTheme/js/babylon', // Adjust the path as needed
    },
    shim: {
        'babylon': {
            exports: 'BABYLON' // Make sure BABYLON is exported correctly
        }
    }
};

Use Babylon.js: Write your Babylon.js code in your custom JavaScript file (e.g., script.js)

require(['babylon'], function(BABYLON) {
    var canvas = document.getElementById('renderCanvas');
    var engine = new BABYLON.Engine(canvas, true);

    // Example scene creation
    var createScene = function () {
        var scene = new BABYLON.Scene(engine);
        // Add your scene setup here
        return scene;
    };

    var scene = createScene();
    engine.runRenderLoop(function () {
        scene.render();
    });

    window.addEventListener('resize', function () {
        engine.resize();
    });
});

• Add HTML Markup: Ensure your HTML includes a canvas element for Babylon.js rendering, like <canvas id="renderCanvas"></canvas>.

• Test: After these steps, clear Magento's cache (php bin/magento cache:clean) and test your store to confirm Babylon.js works without errors.