Collision in Nullengine not working?

[pcace]

Hi there,

i am trying to find the reason why ray collisions seem to be not working in nullEngine.
in the playground it works:

Babylon.js Playground

but when i do this in typescript in a nullengine it just does not find anything:

  const engine = new NullEngine()
  const scene = new Scene(engine)

  console.log('collisions', scene.collisionsEnabled)

  const vertices = [0, 0, 0, 0, 0, 1, 1, 0, 1, 1, 0, 0]
  const indices = [0, 1, 2, 0, 2, 3]
  const customMesh = new Mesh('bla')
  const vertexData = new VertexData()
  vertexData.positions = vertices
  vertexData.indices = indices
  vertexData.applyToMesh(customMesh)

  const testorigin = new Vector3(0.5, 0.5, 0.5)
  const testnormal = new Vector3(0, -1, 0)
  console.log(Ray)
  const ray = new Ray(testorigin, testnormal, 10000)
  console.log('intersectMesh', ray.intersectsMesh)
  const hit = ray.intersectsMesh(customMesh, false) // Check intersection
  console.log('TEST HIT', hit.hit)

so ray is imported, and intersectsMesh function is also there. but for some reason it will not go past the const hit = ray.intersetsMesh… line.

why?

Cheers and thanks for help!

[RaananW]

Will it be possible to provide a stacktrace? or a test project we can test with? feels like a missing side effect/import, but I am not 100% sure

[roland]

Seems to be working for me:

main.ts:

import { AppOne as App } from './AppOne';

console.log(`main.ts starting ${App.name}`);

const app = new App();
app.run();

AppOne.ts:

import { Scene, Vector3, Engine, NullEngine, Mesh, VertexData, Ray, FreeCamera } from "@babylonjs/core";

export class AppOne {
    engine: Engine;
    scene: Scene;

    constructor() {
        this.engine = new NullEngine()
        this.scene = createScene(this.engine)
    }

    run () {
        this.engine.runRenderLoop(() => {
            this.scene.render();
        });
    }
}

const createScene = function (engine: Engine) {
    const scene = new Scene(engine)

    const camera = new FreeCamera("camera1", new Vector3(0, 5, -10), scene);
    camera.setTarget(Vector3.Zero());

    //

    console.log('collisions', scene.collisionsEnabled)

    const vertices = [0, 0, 0, 0, 0, 1, 1, 0, 1, 1, 0, 0]
    const indices = [0, 1, 2, 0, 2, 3]
    const customMesh = new Mesh('bla')
    const vertexData = new VertexData()
    vertexData.positions = vertices
    vertexData.indices = indices
    vertexData.applyToMesh(customMesh)

    const testorigin = new Vector3(0.5, 0.5, 0.5)
    const testnormal = new Vector3(0, -1, 0)
    const ray = new Ray(testorigin, testnormal, 10000)
    console.log('intersectMesh', ray.intersectsMesh)
    const hit = ray.intersectsMesh(customMesh, false) // Check intersection
    console.log('TEST HIT', hit.hit)

    return scene
}

output:

[pcace]

Hi there, i suspect its not related to babylonjs but more to how redwoodjs handles compilation of migration files. (i am currently trying to get babylonNull engine to work inside a redwoodJS migration) (Data Migrations | RedwoodJS Docs)

somehow i cannot import “normally” using import {} from… but instead have to import the babylonjs modules like this:

export const importDynamic = new Function('modulePath', 'return import(modulePath)')

export default async ({ db }: { db: PrismaClient }) => {
  const { NullEngine } = await importDynamic('@babylonjs/core/Engines/nullEngine.js')
  const { Vector3 } = await importDynamic('@babylonjs/core/Maths/math.vector.js')
  const { Mesh } = await importDynamic('@babylonjs/core/Meshes/mesh.js')
  const { VertexData } = await importDynamic('@babylonjs/core/Meshes/mesh.vertexData.js')
  const { VertexBuffer } = await importDynamic('@babylonjs/core/Buffers/buffer.js')
  const { Scene } = await importDynamic('@babylonjs/core/scene.js')

// ..... everything else....
})

i think i need to do some more digging to expect someone else to be able to help out! I will come back here when i have more info to share!

[roland]

What?

No!

try:
import { Scene, Vector3, Engine, NullEngine, Mesh, VertexData, Ray, FreeCamera } from "@babylonjs/core"
or

import { NullEngine } from "@babylonjs/core/Engines/nullEngine"
.
.
.

as I do in my code.

According to the RedwoodJS docs this has to work.

[RaananW]

the .js might be required, depending on the module resolution of your code. Otherwise, it’s a nice-to-have

[roland]

@RaananW No doubt you are the package master here

However to my best knowledge adding the js extension (or any other) when importing from a correctly created npm package breaks the standard convention and may confuse the package/module resolution functionality.

I never used an extension with import to import code. Except when I needed to import a non packaged file.

So I still recommend @pcace to try it w/o the extension and I keep my fingers crossed

[brianzinn]

with ESM it is sometimes essential to do fully specified imports (with file extension) and even directory imports should reference the /index.js. i’ve found this especially in peer imports with type: “module”. for me the standard convention is to include. hopefully you can find a solution without dynamic imports.

[roland]

We are talking about the issue to import from the @babylonjs/core package here and about npm packages which ones conventionally do have exports and my response was bound to this context.

In this case I citate from Node.js docs:

Including the file extension is only necessary for packages without an "exports" field.

IMHO it’s not a convention to not to use exports.

[pcace]

Hi there,

thanks for the ideas - but i think its not related to babylonjs…
here is exact the solution proposed as i have used to get around the importing issue: ES modules aren't supported · Issue #4074 · redwoodjs/redwood · GitHub

but still… its a little bit strange

I am currently getting around the issue by not using the null engine, but instead use rapierjs (i need to shoot some rays to meshes and test the intersection).

Cheers and thanks!

[RaananW]

Yep! also, if the project’s module resolution is set to nodenext or node16 you HAVE to add extensions. .js will default to the module type of the package.json (commonjs or esm). .mjs will always be loaded as a module, .cjs will always be loaded as commonjs. Extensions are essential in many different project setups. And are optional in others

[roland]

@RaananW the question is about @babylonjs/core… So you don’t have to add the extension.

@roland

According to the RedwoodJS docs this has to work.

and it works:

@pcace check out the repo and follow my recommendations. Import babylonjs stuff like I recommended. One more question: How did you install the babylonjs package? @RaananW and @brianzinn were writing about more advanced scenarios.

GitHub - RolandCsibrei/redwood-project