webpack devserver로 개발 환경 세팅

• 깃헙 템플릿을 참고했다. https://github.com/photonstorm/phaser3-project-template

• 컴파일 ****타임에 전역 상수를 선언

  new webpack.DefinePlugin({
    CANVAS_RENDERER: JSON.stringify(true),
    WEBGL_RENDERER: JSON.stringify(true)
  }),
  

• raw-loader 사용

  • 모듈의 내용을 그대로 가져 온다.
  • .vert, .frag 파일

• file-loader를 통해서 이미지 파일을 가져 옴

기본적인 phaser 세팅

• https://phaser.io/tutorials/making-your-first-phaser-3-game/part1

import Phaser from "phaser";

new Phaser.Game({
  type: Phaser.AUTO,
  parent: "phaser-example",
  width: 800,
  height: 600,
  scene: {
    preload: () => {},
    create: () => {},
    update: () => {},
  },
});

• Phaser 객체가 생성되면서 canvas를 렌더링 한다.
• Phaser.AUTO
  • 브라우저가 WEBGL 지원해주지 않으면 CANVAS 모드로 돌아가게 된다.