首页 > 技术文章 > Egret Engine 2D - 项目配置

jason-beijing 2017-08-06 15:27 原文

 
todo
看三个示例项目的完整源码和资源
 
 
<e:Group name="Button" height = "300" verticalCenter="0" horizontalCenter="0">
            <e:layout>
                <e:VerticalLayout gap="0" horizontalAlign="center" verticalAlign ="middle"/>
            </e:layout>
 
lagout是VerticalLayout表示Group里元素整体是垂直方向布局
而里面的参数
gap 表示垂直间距
horizontalAlign 表示整体水平方向的对齐方式 值有 left center right
verticalAlign 表示整体垂直方向的对齐方式 值有 top middle bottom
命令行手册 egret create ProName --type game|eui|gui|game
 
创建第三方库项目
egret create_lib LibName
 
从h5游戏生成app
egret create_app app_name -f h5_game_path -t template_path
 
构建指定项目
egret build [project_name] [-e] [--runtime native]
 
发布项目
egret publish [project_name] [--version [version]] [--runtime html5|native] [--passWorld]
 
启动HttpServer,并在默认浏览器中打开指定项目
egret startserver [project_name] [--port 3000] [-ip] [-serveronly]
 
重置项目中的引擎代码
egret clean [project_name]
 
升级项目代码
egret upgrade [project_name]
编译引擎源码
egret make
版本升级后检测api是否已经替换完成
egret apitest [project_name]
获得Egret信息
egret info
入口文件说明
自定义所需要加入的其他的第三方库的文件。需要填写 egret=”lib” 以及 src-release。在这个块中script不会被自动替换以及清理。切记不要把这种使用方式的文件放在 libs/modules 下。
所有放在 libs 目录下面的文件,以 ts 作为扩展名的文件只能是 .d.ts(如 a.d.ts)文件,不能有纯 ts 文件(如 a.ts)。
 
  • - data-show-pain-rect:是否显示脏矩形区域。
  • - data-multi-fingered:多指最大数量。
  • - data-show-fps:是否显示fps。
  • - data-show-log:是否显示egret.log输出出来的信息。这些会在fps的下面显示出来,和console.log不一样。前提是fps必须打开。
  • - data-log-filter:只显示过滤的log
  • - data-show-fps-style:fps面板的样式。目前只支持4种,x:0, y:0, size:30, textColor:0xffffff。
  egret.runEgret() 启动项目
template
debug用 debug里的
publish用 web里的
egretProperties
native
publish  发布 Web 项目资源文件发布的方式。0,按照原素材路径名称发布;1,会将资源发布成以 crc32 命名方式重新命名
egret_version
urlParam
modules
 
${EGRET_DEFAULT}
${EGRET_APP_DATA}
这两个好像都是engine的安装目录
我的电脑里是C:\Users\Administrator\AppData\Roaming\Egret\engine
 
tsconfig
- "sourceMap": true 编译 .ts 文件至 .js 文件同时生成对应的 .js.map 文件,使用户调试时可以直接调试 .ts 文件而非 .js 文件。
- "removeComments": true 编译 .js 同时删除原本 .ts 文件中的注释
 
以下参数暂时不支持开发者自行设置
"target","outDir","module","noLib","outFile","rootDir","out"
如何用新的方式构建第三方库
- 打开一个第三方库文件夹
    - 删除 package.json中的 modoules 字段
    - 在项目中与 package.json同级创建一个 tsconfig.json 文件
 
// JavaScript 类库
{
"compilerOptions": {
"target": "es5",
"outFile": "bin/libtest1/libtest.js",
"allowJs": true
},
"files": [
"src/a.js",
"src/b.js"
]
}
    - 如果项目是 JavaScript 类库,还需要在 package.json中配置一个 typings字段,并设置为一个自定义的 .d.ts 文件,如下所示
        - 完成上述操作后,执行 egret build,就会根据 tsconfig.json中的 outFile字段生成库文件,压缩文件以及 .d.ts 文件
编译顺序说明
当在 TestCall.ts 中引用了TestB.ts 中的内容时自动将 TestB.js 放在 TestCall.js 之前进行加载
这种情况解决方法也很简单,就是告诉编译器我们的类的依赖关系。在 TypeScript 中,使用<reference>标签来表示引用关系。在 reference 标签中可以标记依赖文件的相对路径。所以只需要在 TestB 类之前加入如下注释即可:
WebAssembly
生成的 .wasm 格式相比 .js在性能上有大幅度的提升
也可以编译成 asm.js 性能上比.js也高一些
  白鹭引擎 5.0 的设计是将引擎核心作为一个 .wasm 库,上层提供 TypeScript API

推荐阅读