Cannot read property 'add' of undefined (scene.impact.add)

I have a project where I’ve successfully integrated Angular 6 and Phaser 3 and gotten it working with Arcade physics. I wanted to move over to Impact physics and immediately got an error when I tried to add an image to the scene:

export class TestScene extends Phaser.Scene {

  public constructor() {
    super({key: 'TestScene'});
  }

  public preload(): void {
    this.load.image("guy", "assets/images/guy.png")
  }

  public create(): void {
    let guy = this.impact.add.image(300, 300, 'guy');
  }
}

let guy = this.impact.add.image(300, 300, 'guy');
throws the error
Cannot read property 'add' of undefined

Below is my configuration object:

public readonly config = {
  type: Phaser.WEBGL,
  width: 800,
  height: 600,
  physics: {
    impact: {
      gravity: 100,
      setBounds: {
        width: 800,
        height: 600
      }
    }
  }
};

I’m using the latest phaser.d.ts from https://github.com/photonstorm/phaser3-docs/blob/master/typescript/phaser.d.ts and the following is in my package.json

"dependencies": {
  ...
  "phaser": "^3.15.1",
  "phaser-component-library": "^2.0.0",
  ...
}

Any help or thoughts would be appreciated!

I was able to solve my problem by using the phaser.d.ts from https://github.com/TristanBonsor/phangular/blob/master/src/phaser.d.ts – looks like this is specifically aimed at Phaser / Angular integration. I’m unclear on what was missing from the one I was using but it’s good to be back in business :slight_smile: