My Javascript Phaser Udemy Game example needs some suggestions to fire-up

Hi
In a Udemy video lecture on 'building games with phaser', the instructor is working w the following 'ColorZap' project code zip below..
He is using brackets for an IDE, so so am I:

My XAMPP serves the files correctly, no problem, in Safari.

So, he has a main.js that tries to start the game object.

main.js :

var game;
//var score;
//var soundOn = true;

window.onload = function () {
    if (screen.width > 1500) {
        //desktop laptop
        game = new Phaser.Game(480, 640, Phaser.AUTO, "ph_game");

    } else {
        //mobile device
        game = new Phaser.Game(window.innerWidth, window.innerHeight, Phaser.AUTO, "ph_game");
    }
    //add a state or screen to the game
    game.state.add("StateMain", StateMain);
    game.state.add("StateTitle", StateTitle);
    game.state.start("StateTitle");

}

Select allOpen in new window

But, the Problems console claims:

"Missing 'use strict' statement    if (screen.width > 1500) {

but most notably: Phaser was used before it was defined. . game = new Phaser.Game(480, 640, Phaser.AUTO, "ph_game");

which puzzles me, because where are the lines of code in his example or way this can work? I wrote the code from the Udemy vid. I can't imagine I left something off.

These project files are attached also. What could I not have done? Where do I define Phaser for it? Is there a  #include equivalent?
A black rectangle appears in the browser to test the code, so I know the size of the program area is being registered properly.

Thanks
colorZap-copy.zip