javascript - Phaser 3 循环依赖问题

Question

如何解决 Phaser 3 中的循环依赖

背景

我正在使用 Phaser 3、TypeScript 和 Parcel 制作游戏。我添加了一些实现某些接口(interface)的类，但这些接口(interface)相互导入和使用。我开始使用带有 airbnb 规则集的 eslint。他们实现的规则之一是import/no-cycle，但我觉得我的游戏需要它。

示例代码

游戏界面.ts

import { Scene } from 'phaser';
import PlayerInterface from '../../entities/player/PlayerInterface'; // circular

interface GameInterface extends Scene {
  player: PlayerInterface;
}

export default GameInterface;

PlayerInterface.ts

import GameInterface from '../../scenes/game/GameInterface'; // circular

interface PlayerInterface extends Phaser.Physics.Arcade.Sprite {
  scene: GameInterface;
  speed: number;
}

export default PlayerInterface;

问题

在“Game”中添加了一个“Player”，Player类有一个场景。所以他们都需要在界面中。因为这只是一个类型文件，我可以忽略这个规则吗？或者我可以进行切肉刀重组吗？

编辑1

另外here是完整仓库的链接。

编辑2

下面是实现这些接口(interface)的 2 个类。

游戏.ts

class Game extends Scene implements GameInterface {
  player: PlayerInterface;

  constructor() {
    super({
      key: 'Game',
    });
  }

  preload(): void {
    /* preload code */
  }

  create(): void {
   /* create code */ 
  }
}

播放器.ts

class Player extends Phaser.Physics.Arcade.Sprite implements PlayerInterface {
  scene: GameInterface;

  constructor(scene: GameInterface) {
    super(scene, x, y, 'player');
    this.scene = scene;
    this.scene.add.existing(this);
    this.scene.physics.add.existing(this);
  }

  static preload(scene: GameInterface): void {
    /* preload */
  }
}

如您所见，游戏类创建了玩家，但玩家在创建时也传递了一个场景。

Answer 1

首先 Circular Dependency 意味着当你有两个类 A 和 B 时:

• A类使用B类，所以A依赖于B
• 类B使用类A，所以B也依赖于A

结果，在初始化这两个类时，它会抛出一个无限循环，因为它想基于 B 创建类 A，而类希望基于类 A 创建，尽管它进入了受益循环。

所以就砍掉不必要的依赖。

1. 因此在Game 类中，您似乎不需要使用PlayerInterface。
2. 而且您也不需要在您的界面中从 Scene 和 Phaser.Physics.Arcade.Sprite 进行扩展。因为您已经在具体类中扩展了它们。只需删除它们即可。