2.2　新建项目

首先，打开LayaAir IDE（以下简称IDE），单击【新建项目】按钮，在新建项目面板中进行下列设置。

• 项目类型：LayaAir空项目。

• 项目名称：myArrow。

• 项目路径：D:\layabox2x\laya2project\chapter2。

• 编程语言：JavaScript。

然后，单击【创建】按钮完成项目创建，如图2.2所示。

项目创建完成后，首先切换到编辑模式，然后单击【菜单按钮】→【文件】→【项目设置】选项，打开项目设置面板（快捷键是【F9】，项目设置面板只能在编辑模式下打开）。

在项目设置面板中选择【预览设置】选项，然后设置下列属性，如图2.3所示。

• 场景适配模式：showall。

• 水平对齐模式：center。

• 设计宽度：720。

• 设计高度：1280。

单击【确定】按钮，保存设置。此时，如果运行或调试项目，得到的是一个竖屏的空界面，背景默认为黑色。

切换到代码模式，展开资源管理器中的src目录，单击src/GameConfig.js文件，在编辑器中查看代码，可以发现之前在项目设置面板中设置的属性已经保存在代码中了，具体如下。

注意：src/GameConfig.js文件是IDE自动生成的，手动修改无效。参数设置只能在项目设置面板中修改。

单击资源管理器中的src/main.js文件，查看代码。src/main.js是项目的主入口文件，是一个符合ECMAScript 6（以下简称ES6）标准的JavaScript文件，在创建项目时IDE会自动生成这个文件，具体代码解读如下。

首先，完成了对项目设置参数的加载。随后，定义了一个Main类，并在构造方法constructor中完成了引擎的初始化设置。最后，新建一个Main实例来实现项目的入口功能。代码如下。

Laya.ResourceVersion.enable及方法onVersionLoaded()、onConfigLoaded()实现了资源加载和场景加载的功能。为了更好地了解LayaAir的工作原理，在本章中，不使用场景（Laya.Scene），删除Laya.ResourceVersion.enable及方法onVersionLoaded()、onConfigLoaded()，添加一个新定义的全局方法init()来承载需要实现的功能。修改后的src/main.js文件的完整代码如下。

完成代码修改后，在LayaAir调试模式下调试项目（快捷键【F5】），将得到如图2.4所示的调试结果。可以看到，界面上显示性能统计信息，并在调试控制台输出“Hello World！”。

注意：在LayaAir调试模式下，console.log是在调试控制台输出的。如果希望在IDE中查看console.log的输出结果，则只能使用调试模式。

至此，我们已经做好了开发项目的准备，是时候了解代码的编译细节了。在代码模式下，在资源管理器中展开bin目录。bin目录是项目编译目录，bin/index.html是整个项目运行的基础文件，其中包含index.js文件，代码如下。

在index.html文件中定义一个loadLib方法，加载模块，代码如下。

打开index.js文件后，会看到下面的语句。js/bundle.js是项目的业务逻辑代码编译后获得的脚本文件，能在其他类库文件的配合下实现项目的功能。打开js/bundle.js文件，可以找到与src/main.js文件相同的代码片段。

由此可见，在IDE中调试或运行项目时，文件调用顺序是bin/index.html→bin/index.js→bin/js/bundle.js。