phaser学习(2)-hello world

设置好编辑器，安装好web服务器以及下载 phaser 之后，就可以开始 phaser 的正式旅途了。

我们需要把我们的代码文件放到web服务器的根目录下， 所以说我们需要先找到我们web服务器的根目录，然后创建一个 index.html 文件，访问 http://localhost能够访问到这个 index.html 文件就可以了。

我们把以下代码粘贴到这个 HTML 文件中去。

< html>
< head>
    < script src="https://cdn.jsdelivr.net/npm/phaser@3.15.1/dist/phaser-arcade-physics.min.js">< /script>
< /head>
< body>

    < script>
    var config = {
        type: Phaser.AUTO,
        width: 800,
        height: 600,
        physics: {
            default: 'arcade',
            arcade: {
                gravity: { y: 200 }
            }
        },
        scene: {
            preload: preload,
            create: create
        }
    };

    var game = new Phaser.Game(config);

    function preload ()
    {
        this.load.setBaseURL('http://labs.phaser.io');

        this.load.image('sky', 'assets/skies/space3.png');
        this.load.image('logo', 'assets/sprites/phaser3-logo.png');
        this.load.image('red', 'assets/particles/red.png');
    }

    function create ()
    {
        this.add.image(400, 300, 'sky');

        var particles = this.add.particles('red');

        var emitter = particles.createEmitter({
            speed: 100,
            scale: { start: 1, end: 0 },
            blendMode: 'ADD'
        });

        var logo = this.physics.add.image(400, 100, 'logo');

        logo.setVelocity(100, 200);
        logo.setBounce(1, 1);
        logo.setCollideWorldBounds(true);

        emitter.startFollow(logo);
    }
    < /script>

< /body>
< /html>

然后，尝试着访问下试试？

http://localhost/或者http://127.0.0.1/

如果出现了上述图片，那么就证明我们已经成功了！