Layabox游戏引擎

[vieyahn2017]

Layabox

[vieyahn2017]

一、laya学习笔记 --- layabox环境搭建 HelloWorld（坑：ts版本问题解决方案）
好吧，使用layabox需要从官网下载些啥呢

一、下载layabox
官网 https://www.layabox.com/

首页上有两个，一个Engine，一个IDE

Engine我下载的TS版本，解压后，就是一个库

IDE则是绿色版的，下载无需安装即可使用。我下载的当前最新版本1.7.19.1 beta

[vieyahn2017]

LayaAir2.x项目编译的三种方式
原文链接：https://blog.csdn.net/cswxb/article/details/127742334

一、 使用Laya官方编译器–layaair2-cmd

1. 安装
   npm install -g layaair2-cmd

2. 使用
   layaair2-cmd compile

3. 优缺点
   小项目编译速度快，Laya编辑器内嵌该编译器，但是大型项目编译速度非常慢

二、 Webpack

1. 安装
   首先将项目初始化为npm项目，在项目根目录下执行npm init
   然后安装依赖： npm install -D typescript webpack webpack-cli ts-loader
   安装全局工具: npm install -g webpack webpack-cli

2. 配置
   在项目根目录下创建webpack.config.js,并配置，这里提供一份参考

var path = require("path");
module.exports = {
    mode: "development",
    entry: "./src/Main.ts",
    output: {
        path: path.resolve(__dirname, "bin/js"),
        filename: "bundle.js"
    },
    resolve: {
        extensions: [".ts", ".tsx"]
    },
    module: {
        rules:[
            { test: /\.tsx?$/, use: "ts-loader" }
        ]
    },
    target: "web",
    devtool: "source-map"
}

3. 使用
   项目根目录下执行
   webpack

4. 优缺点
   大型项目编译速度比第一种方式要快很多，但是配置比较复杂，依赖较多。

三、EsBuild

1. 安装
   npm install -g esbuild

2. 使用
   esbuild --bundle src/Main.ts --outfile=bin/js/bundle.js --sourcemap

3. 优缺点
   编译速度非常快，大型项目也能做到秒编，但是由于EsBuild并不是基于语法树生成代码，所以无法检查某些语法级错误，另外对于const enum声明的枚举，无法以数字常量进行替换。

总结
以上三种方式，都能用来编译laya2项目，每种方式都有优点以及缺点。我个人结合实际项目还是非常推荐大家用第三种方式的。对于第三种方式的缺点，我们也是可以通过其他方法加以避免的。

[vieyahn2017]

关于Laya引擎的一些思考
https://blog.csdn.net/gghhb12/article/details/136245742

[vieyahn2017]

酱油师兄

laya引擎学习（一、初识）
https://blog.51cto.com/u_9036625/4907140

laya引擎学习（二、第一个界面）
https://blog.51cto.com/u_9036625/4907138

laya引擎学习（三、laya节点树）
https://blog.51cto.com/u_9036625/4905335

laya引擎学习（四、生命周期）
https://blog.51cto.com/u_9036625/4905337

[vieyahn2017]

Laya Sprite
https://blog.csdn.net/JunChow520/article/details/103031096

游戏中Sprite精灵是在屏幕中能够被控制的显示对象，如果屏幕中的显示对象不能被控制那就只是一个节点。
准确来说，Sprite精灵是一个能够通过改变自身属性，比如角度、位置、伸缩、颜色等，变为可控动画的2D图像。

结构  描述
Package laya.display.Sprite
Class Laya.Sprite
Inheritance Sprite / Node / EventDispatcher / 

ObjectSprite是基础的显示图形的显示列表节点，LayaAir引擎核心显示类只有一个Sprite类，Sprite会针对不同情况自动渲染优化。
Laya.Sprite类位于Core核心类库中，是laya.display.Sprite类封装后形成的。

[vieyahn2017]

Laya引擎生产力工具LayaTree
https://blog.csdn.net/q641187432/article/details/122620810

LayaTree是Chrome浏览器平台上的专门为Laya引擎设计的生产力工具。能在项目运行时阶段进行调试和修改。
目前功能在不断迭代中，致力于实现类似于Unity编辑器的开发体验。
相比于laya.debugtool.js​在使用过程中导致的节点的强引用, LayaTree使用了索引缓存方案,在保证性能的同时,又避免了内存泄露的风险.
LayaTree目前已在chrome浏览器网上商店上架，搜索laya即可下载安装。

[vieyahn2017]

搜到的demo

https://github.com/Lyall-X/laya_lesson

打地鼠
单机斗地主

[vieyahn2017]

该项目是基于tsconfig.json的

怎么运行？

npm install -g typescript
npm install -g ts-node
npm list -g
tsc

怎么运行？

npm install -g layaair2-cmd
npm install -g esbuild
npm install -g layabox-esbuild -g
leb 成功

[vieyahn2017]

https://github.com/yanmingjie0223/Laya

BaseClass
js 版本基础 core 游戏框架，版本：1.7.5
BaseClassES6
js es6 版本基础 core 游戏框架, 版本：1.7.12
BaseClassTS
ts 版本基础 core 游戏框架, 版本：2.12.2
ui 为 fairgui
spine 模板优化
shader 自定义
WebpackTS
使用 webpack ts 增量打包

[vieyahn2017]

https://github.com/Edimier/laya_bomb
一个基于laya的简易炸弹人H5游戏，包括了websocket网络层封装、proto协议封装、http封装，可以当作一个多人在线游戏的demo继续做深入的开发。

[vieyahn2017]

https://github.com/lanbomo/laya-snakes
仿照 贪吃蛇大作战 的练手项目，前端时间接触了一下layabox，发现其性能表现确实很强劲，就做了这个贪吃蛇小作战学习使用一下。

[vieyahn2017]

最初搜 Laya.Sprite
搜到的

https://github.com/dream-young-soul/h5_mir

tsc报错

tsc
src/Config/GlobalConfig.ts:28:16 - error TS2322: Type '0' is not assignable to type 'ShowItemTipsType'.

28 public _ShowItemTipsType:UI.ShowItemTipsType = 0; //当前要显示的道具tips类型

src/UIEx/Window/ItemTips.ts:14:17 - error TS2322: Type '0' is not assignable to type 'ShowItemTipsType'.

14 private m_ShowType:ShowItemTipsType = 0;
~~~~~~~~~~

Found 2 errors in 2 files.

Errors Files
1 src/Config/GlobalConfig.ts:28
1 src/UIEx/Window/ItemTips.ts:14

改成any类型即可


怎么运行？