CannonJSPlugin() on ANGULAR 8, CANNON is not defined

Bugs
1

Hi all, i’m trying to do some test building a Babylon playground on a new project in Angular 8, all goes well but when I want to use physics on the scene I get ‘‘CANNON is not defined’’ error (Chrome console); I added CANNON using yarn but the error still the same. i suppose i am doing all correctly.

var scene = new BABYLON.Scene(engine);
var gravityVector = new BABYLON.Vector3(0, -9.81, 0);
/**/var physicsPlugin = new BABYLON.CannonJSPlugin();
scene.enablePhysics(gravityVector, physicsPlugin);

it compiles, but i get this error on browser’s console

ReferenceError: CANNON is not defined
at new e (babylon.js:16)
at createScene (babylon.component.ts:156) ----> /**/
at BabylonComponent.ngAfterViewInit (babylon.component.ts:168)
at callProviderLifecycles (core.js:32328)
at callElementProvidersLifecycles (core.js:32293)
at callLifecycleHooksChildrenFirst (core.js:32275)
at checkAndUpdateView (core.js:44281)
at callViewAction (core.js:44637)
at execEmbeddedViewsAction (core.js:44594)
at checkAndUpdateView (core.js:44272)

2

you need CANNON defined on the window, so either you place it in your html from a cdn or you need before creating the plugin something alongside:

window.CANNON = require(‘cannon’)

2 Likes
3

It worked including cdn. Thanks a lot!