Is it possible to use attribute decorators outside of the editor?

I’m trying to use ESM scripts outside of the editor. This is what I have done so far:

import { Script } from 'playcanvas';

export default class MyScript extends Script {
  static scriptName  = 'myScript'
  static schema = {
    myAttribute: {
      type: 'string'
    }
  }

  /**
   * @attribute
   * @type string
   */
  myAttribute = 'default value';

  initialize() {}
}

import MyScript from './my-script';

app.scripts.addSchema('myScript', {
  attributes: MyScript.schema
});

app.root.addComponent('script');
app.root.script.create(MyScript, {
  attributes: {
    myAttribute: 'another value'
  }
});

Vite doesn’t do anything with the decorators so I have to add the schema manually. Is there a way to do this automatically with a build system like Vite or Webpack? Or is there another way to work with ESM scripts outside of the editor?

Here’s a little engine example showing how to load a script as an asset and assign it to an entity:

1 Like