在基于TypeScript的LayaAir HTML5游戏开发中使用AMD
在基于TypeScript的LayaAir HTML5游戏开发中使用AMD
AMD
AMD是"Asynchronous Module Definition"的缩写,意思就是"异步模块定义"。这是目前最流行的JavaScript/TypeScript代码的管理方式。本文介绍了如何在基于TypeScript的LayaAir HTML5游戏开发中使用AMD来组织代码。本文参考资料列表中包含了更多关于AMD的信息。
示例项目
示例项目源码从这里下载https://github.com/wildfirecode/HTML5-Game-AMD-TypeScript.
创建项目
依然使用LayaIDE来创建项目,因为要使用LayaAir引擎的库文件。
使用Visual Studio Code作为编码调试环境
为了能够对index.html有绝对的控制权,我们不能再使用LayaIDE,为了能够编译和调试项目,我们需要添加一些额外的配置。
- 复制示例项目中的
.vscode
文件夹到自己项目的根目录。 在index.html文件中引入所有的游戏代码编译文件
<script src="./js/game.js"></script>
在index.html文件中启动游戏。
<script> require(['GameMain'], function (GameMain) { new GameMain.default() }); </script>
增加LayaAir引擎适配模块
adapter.ts
,每一个LayaAir的类都要增加一个适配。比如Laya.EventDispatcher
:export const EventDispatcher = Laya.EventDispatcher;
使用示例项目中的
tsconfig.json
覆盖原来的tsconfig.json
文件。
编译和调试
编译使用快捷键Ctrl+Shift+B
,调试使用F5
,过程基本和LayaAir相同。更多信息参考VSCode官方文档。
requirejs
从requirejs官方下载库文件,目前的最新版本是2.3.4,这是下载链接http://requirejs.org/docs/release/2.3.4/minified/require.js。把下载的库文件放入./bin
目录,并且在index.html增加文件引用,具体参见示例项目。
插件推荐
为了能够自动import,需要下载额外的VSCode插件,这里是插件地址 https://marketplace.visualstudio.com/items?itemName=rbbit.typescript-hero。
参考
在基于TypeScript的LayaAir HTML5游戏开发中使用AMD的更多相关文章
- 使用Visual Studio Code调试基于ActionScript的LayaAir HTML5游戏
使用Visual Studio Code(VS Code)调试的优势 使用VS Code我们可以极大地提高LayaAir Html5游戏项目的调试效率,VS Code的优势有以下几点: 在发生Java ...
- 借助Visual Studio Code提高基于ActionScript的LayaAir HTML5游戏的调试效率
借助Visual Studio Code提高基于ActionScript的LayaAir HTML5游戏的调试效率 使用Visual Studio Code(VS Code)调试的优势 借助VS Co ...
- 借助AMD来解决HTML5游戏开发中的痛点
借助AMD来解决HTML5游戏开发中的痛点 游戏开发的痛点 现在,基于国内流行引擎(LayaAir和Egret)和TypeScript的HTML5游戏开发有诸多痛点: 未采用TypeScript编译器 ...
- 自动化的基于TypeScript的HTML5游戏开发
自动化的开发流程 在HTML5游戏开发或者说在Web客户端开发中,对项目代码进行修改之后,一般来说,需要手动刷新浏览器来查看代码修改后运行结果.这种手动的方式费时费力,降低了开发效率.另外,如果我们使 ...
- Cocos2d-x游戏开发中的消息机制:CCNotificationCenter的使用
在HTML5游戏开发中,js可以使用Event对象的addEventListener(添加事件监听).dispatchEvent(触发事件)实现监听机制,如果在coocos2d-x中,去实现这种机制该 ...
- Egret是一套完整的HTML5游戏开发解决方案
Egret是一套完整的HTML5游戏开发解决方案.Egret中包含多个工具以及项目.Egret Engine是一个基于TypeScript语言开发的HTML5游戏引擎,该项目在BSD许可证下发布.使用 ...
- CutJS – 用于 HTML5 游戏开发的 2D 渲染引擎
CutJS 是轻量级的,快速的,基于 Canvas 开发的 HTML5 2D 渲染引擎,可以用于游戏开发.它是开源的,跨平台的,与现代的浏览器和移动设备兼容.CutJS 提供了一个类似 DOM 树的 ...
- 优秀工具推荐:两款很棒的 HTML5 游戏开发工具
HTML5 众多强大特性让我们不需要多么高深技术就能创建好玩的网页游戏,同时证明了开放的 Web 技术能与任何其他在游戏开发中使用的技术竞争.正如标题所说,这篇文章推荐的几款很棒 HTML5 游戏开发 ...
- HTML5游戏开发引擎,初识CreateJS
CreateJS为CreateJS库,可以说是一款为HTML5游戏开发的引擎.打造 HTML5 游戏,构建新游戏,提供构建最新 HTML5 的技术.你可以通过这个网站学习如何构建跨平台和跨终端游戏.这 ...
随机推荐
- java实现https请求
package com.lichmama.test; import java.io.IOException; import java.net.URL; import java.security.Key ...
- delphi选择打印机打印
printer.getprinter(mdevice, mdriver, mport, mhdmode); printer.setprinter(pchar(g_PRNzt), mdriver, mp ...
- Servlet 中为多项选择题判分---String类的indexOf()方法妙用
首先来看一下String类的indexOf()方法的用法: public class FirstDemo1 { /** *API中String的常用方法 */ // 查找指定字符串是否存在 publi ...
- C# Web.config配置
使用 <!--M002 バッチを起動のPath配置--> <add key="BM0002_START_PATH" value="D:\BM0002\B ...
- 改进log4go的一些设想
log4go 的 4.0.2 版本(https://github.com/ccpaging/log4go/tree/4.0.2)发布以后, 看了看别的 go 语言日志文件设计.发现了一篇好文: log ...
- CDH版本的oozie安装执行bin/oozie-setup.sh prepare-war,没生成oozie.war?
不多说,直接上干货! 前期博客 Oozie安装部署 问题描述 bin/oozie-setup.sh prepare-war 解决办法 [hadoop@bigdatamaster bin]$ pwd / ...
- iOS App签名的原理
前言 相信很多同学对于iOS的真机调试,App的打包发布等过程中的各种证书.Provisioning Profile. CertificateSigningRequest.p12的概念是模糊的,导致在 ...
- [转]从入门到精通: 最小费用流的“zkw算法”
>>>> 原文地址:最小费用流的“zkw算法” <<<< 1. 网络流的一些基本概念 很多同学建立过网络流模型做题目, 也学过了各种算法, 但是对于基本 ...
- 原生JSdom节点相关(非原创)
节点属性 Node.nodeName //返回节点名称,只读 Node.nodeType //返回节点类型的常数值,只读 Node.nodeValue //返回Text或Comment节点的文本值,只 ...
- maven简介及基础使用
一.Maven简介 Maven可译为"知识的积累"."专家",主要服务于基于Java平台的项目构建.依赖管理和项目信息管理. 1.Maven-项目构建工具 ...