想用ES6语法开发phaserjs游戏，是phaserCE，但是不知道怎么导入，总是报错，后来经过多次尝试，解决方法如下：

干脆不导入，直接暴露到window里，然后模块化的代码全部在window.onload后执行，即可跳过编译时报错问题，

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,minimum-scale=1.0,user-scalable=no">

    <link rel="stylesheet" href="/stylesheets/reset.css"/>

    <link rel="stylesheet" href="/stylesheets/style.css"/>

    <link rel="stylesheet" href="/stylesheets/black.css"/>

    <script type="text/javascript" src="/javascripts/plugins/rem.js"></script>

    <title><%= mtitle %></title>

</head>

<body>

    <div id="game"></div>

    <script src="/javascripts/phaserDemo/plugins/phaser.js"></script>

    <script src="/javascripts/phaserDemo/plugins/phaser.min.js"></script>

    <script src="/javascripts/phaserDemo/Game.js" type="module"></script>

    <script src="/javascripts/phaserDemo/Main.js" type="module"></script>

</body>

</html>

html页面的phaser的type不能设置'module'，设置的话会报错，报错原因其实是找不到root，暂且不管报错原因，在Main.js模块中，添加window.onload然后把游戏入口js模块导入初始化即可

Main.js

import Game from './Game.js'

window.onload = function(){

    var game = new Game();

}

Game.js

export default class Game{

    constructor(){

        this.init();

    }

    init(){

        this.game = new Phaser.Game(1280,720,Phaser.AUTO);

    }

}

或者

export default class Game extends Phaser.Game{

    constructor(width=1280,height=720,renderer=Phaser.AUTO,parent=''){

        super(width,height,renderer,parent);

        this.init();

    }

    init(){

        // this.game = new Phaser.Game(1280,720,Phaser.AUTO);

    }

}

下一步就可以定义state，全部导入到Game里，初始化，继续下一步了。

最后开发好的项目要用babel或者webpack打包一下

每个人的想法都不一样，所以开发框架及架构肯定也不一样，遵循自己的想法，不管怎样，适合自己的就是最好，希望我的这个简单到大道至简的框架能给过客一点启发。

Phaserjs怎样用ES6开发游戏的更多相关文章

  1. webpack+react+redux+es6开发模式

    一.预备知识 node, npm, react, redux, es6, webpack 二.学习资源 ECMAScript 6入门 React和Redux的连接react-redux Redux 入 ...

  2. [webpack] 配置react+es6开发环境

    写在前面 每次开新项目都要重新安装需要的包,简单记录一下. 以下仅包含最简单的功能: 编译react 编译es6 打包src中入口文件index.js至dist webpack配置react+es6开 ...

  3. GJM : 各大开发游戏引擎

    感谢您的阅读.喜欢的.有用的就请大哥大嫂们高抬贵手"推荐一下"吧!你的精神支持是博主强大的写作动力以及转载收藏动力.欢迎转载! 版权声明:本文原创发表于 [请点击连接前往] ,未经 ...

  4. 独立开发游戏越来越容易：Unity 发布旗下的最新游戏引擎 Unity 5，依然有免费版（转）

    独立开发者开发游戏正变得越来越容易,因为在游戏设计中很多吃力不讨好的工作可以直接采用像 Epic Games 或 Unity Technologies 这样的游戏引擎来解决.而这几天,游戏引擎商们先后 ...

  5. 【转】针对iOS VS. Android开发游戏的优劣——2013-08-25 17

    http://game.dapps.net/gamedev/experience/8670.html 问题:如果你正在一个新工作室开发一款新的平板/手机游戏,你会选择iOS还是Android? 回答: ...

  6. 【C语言探索之旅】 第三部分第二课：SDL开发游戏之创建窗口和画布

    内容简介 1.第三部分第二课: SDL开发游戏之创建窗口和画布 2.第三部分第三课预告: SDL开发游戏之显示图像 第三部分第二课:SDL开发游戏之创建窗口和画布 在上一课中,我们对SDL这个开源库做 ...

  7. 【C语言探索之旅】 第三部分第一课：SDL开发游戏之安装SDL

    内容简介 1.课程大纲 2.第三部分第一课: SDL开发游戏之安装SDL 3.第三部分第二课预告: SDL开发游戏之创建窗口和画布 课程大纲 我们的课程分为四大部分,每一个部分结束后都会有练习题,并会 ...

  8. 【转】使用gulp 进行ES6开发

    原谅地址:https://segmentfault.com/a/1190000004394726 一说起ES6,总会顺带看到webpack.babel.browserify还有一些认都不认识的blab ...

  9. webpack+react+redux+es6开发模式---续

    一.前言 之前介绍了webpack+react+redux+es6开发模式 ,这个项目对于一个独立的功能节点来说是没有问题的.假如伴随着源源不断的需求,前段项目会涌现出更多的功能节点,需要独立部署运行 ...

随机推荐

  1. Intel Driver and Support Assistant 安装失败

    Intel Driver and Support Assistant 以下简称 Intel DSA. Intel DSA 依赖 Microsoft Visual C++ 2015-2019 Redis ...

  2. 2018.08.14【2018提高组】模拟A组 比赛总结

    题解 这次的A组难得得水. T1 这题我一看,就想起了GDOI的一道题--密码锁 \(O(n)\)算法--差分 于是乎兴奋地发现这道题可以用差分来解. 设\(f_i=a_i-a_{i-1}\). 然后 ...

  3. linux 三剑客之awk总结

    AWK 1.begin end使用 cat /tmp/passwd |awk -F ':' 'BEGIN {print "hello"} {print $1"\t&quo ...

  4. CVE-2018-18955漏洞学习

    简介 这是名称空间的漏洞,文章先介绍user namespaces的简单只是,然后从补丁入手,分析源码,找到漏洞出现的原因.因为对这块的源码不是那么熟悉,所以着重描述源码分析的部分,其他可以参考末尾的 ...

  5. mybatis插入出现org.apache.ibatis.executor.ExecutorException: No setter found for the keyProperty 'xxx'异常的原因

    确定有setter方法,问题其实是xml文件中,insert的主键的列名写错了,如下,一开始写成ComId <insert id="insertCom" parameterT ...

  6. CALL apoc.cypher.doIt创建动态节点的时候怎么指定多个标签？

    下面的创建节点实例,请教一下CALL apoc.cypher.doIt如何创建多个标签?现在的方式是只能指定一个标签! UNWIND [{name:"sdasdsad234fdgsasdfa ...

  7. 第五章 表表达式 T-SQL语言基础

    表表达式 Microsoft SQL Server支持4种类型的表表达式:派生表(derived table),公用表表达式(CTE,common table expression),视图,以及内联表 ...

  8. Linux系统定时备份网站文件到七牛云存储脚本

    1.七牛云账号注册. 有些朋友可能会问为什么要备份到七牛云?很简单,七牛云免费注册就能获取1G的存储空间,只要简单几步操作完成实名认证即可获取10G的存储空间,对于一般个人站点来说已经足够备份使用了. ...

  9. nodejs---crypto模块MD5签名

    1.MD5是一种常用的哈希算法,用于给任意数据一个“签名”.这个签名通常用一个十六进制的字符串表示: /*md5签名*/ /*引入crypto模块*/ const crypto = require(' ...

  10. ubuntu18.04系统安装及php7.2,apache2,mysql8,git,svn,composer,vs code 到安装 php 扩展配置php.ini 实现 laravel5.8 运行

    简介:记录自己从系统安装到环境配置完毕运行laravel的记录    • 下载ubuntu18.04桌面版        ○ ubuntu18.04中国官网 https://cn.ubuntu.com ...