How to use Babylon.js Particle Editor with ES6

Hi all!

I read the following great post.

What’s new is that you can now create and edit them not only in your code but also via an Editor accessible via our Inspector.

The editor works on babylon playground, but no particle system is showed on Inspector with ES6.
(Please find attached jpg)

My repo.

Should I implement something in addition to the following? Many thanks!

npm install --save-dev @babylonjs/inspector
import "@babylonjs/core/Debug/debugLayer"; // Augments the scene with the debug methods
import "@babylonjs/inspector"; // Injects a local ES6 version of the inspector to prevent automatically relying on the none compatible version
...
scene.debugLayer.show();

ref: ES6 - Babylon.js Documentation

My package-lock.json is here.

    "@babylonjs/inspector": {
      "version": "4.1.0",
      "resolved": "https://registry.npmjs.org/@babylonjs/inspector/-/inspector-4.1.0.tgz",
      "integrity": "sha512-LcNqPzRV0t7x/ubsgFzP0ByIbEcY1tmp+fEpgmuMtiD2hViU2/PQFwlTMwDVCjEN3HHa4Je72j95ItqS4cefpg==",
      "dev": true,
      "requires": {
        "@babylonjs/core": "4.1.0",
        "@babylonjs/gui": "4.1.0",
        "@babylonjs/loaders": "4.1.0",
        "@babylonjs/materials": "4.1.0",
        "@babylonjs/serializers": "4.1.0",
        "babylonjs-gltf2interface": "4.1.0",
        "tslib": "^1.10.0"
      }
    },

Hi Limes2018,

@Deltakosh can confirm, but I think the particle editor is a very new feature that landed just after 4.1.0; I think 4.2.0-alpha.1 might be the first version of Babylon with the particle editor. Can you try upgrading to a newer version and see if that fixes the issue?

2 Likes

@syntheticmagus

Great thanks for your support! As you said, I overlooked npm package version.

I updated my npm package and tried again. Particle editor works!

$ npm install  @babylonjs/core@4.2.0-alpha.17
$ npm install  @babylonjs/materials@4.2.0-alpha.17
$ npm install  @babylonjs/inspector@4.2.0-alpha.17