cocosCreator 入门(一) 目录结构及代码配置


官网:https://www.cocos.com/

参考:https://docs.cocos.com/creator/manual/zh/getting-started/project-structure.html

配置: MacOS 10.12.6  CocosCreator2.3.3 JavaScript

 

引擎结构

查看cocosCreator的引擎代码相关,步骤:

cocosCreator简单的说,主要有三部分组成:编译器,cocos2d-x, cocos2d-js。我们可以打开:

应用程序 -> CocosCreator(文件夹) -> Creator -> 2.3.3 -> CocosCreator -> 显示包内容 -> Contents -> Resources 

cocos2d-x: cocos2d-x版本的删减版,比如删除了一些其他平台的支持,仅保留了IOS, Android, Windows版本;删除了Lua库支持相关

engine/cocos2d: cocos2d-js删减版本,仅保留了为编译器和打包所需要的文件

engine/editor: 编译器相关

它采用ECS(Entity Component System)组件设计模式,该模式的特点就是将各种功能封装成组件的形式,然后将组件挂载在指定的容器节点上。

该设计模式提倡使用组合代替继承,可以很好的封装和重用功能组件,并且可以轻松的扩展引擎。

 

目录结构

使用Dashboard创建EmptyProject后,其项目目录结构为:

(标记部分用于Git版本控制)

.gitgnore 忽略配置文件相关,新建项目后自动生成,用于Git版本控制相关

assets资源文件夹相关,用于放置游戏中的资源,脚本等文件,放置在该目录下的文件才能在资源管理器中显示。

creator.d.ts/jsconfig.jsonJavaScript API智能提示相关

操作步骤:开发者 -> Vs Code工作流 -> 更新Vs Code智能提示数据。

注意:javScript项目勿点击 添加TypeScript项目配置会生成tsconfig.json导致javaScript智能提示无效。

若出现此问题,删除tsconfig.json文件

library:资源库相关,将assets中的资源导入后生成,该目录下文件丢失或损坏的时候,删除后打开项目就会重新生成。

local:本地配置相关,包含编译器面板布局,窗口大小,位置等信息。

packages扩展相关 ,用于放置项目自定义扩展插件,若想卸载插件,在packages下删除指定文件夹即可。

project.json项目配置文件,和assets在一起用于验证cocosCreator项目合法性的标志。

settings项目设置相关,如构建发布菜单里的包名,场景和平台选择等。

temp:临时文件夹相关,用于缓存cocosCreator在本地的临时文件

build:  在第一次构建发布后才会生成,构建发布相关:项目 -> 构建发布

 

assets说明:

该路径下的资源包含文件夹在导入后都会生成对应的.meta资源配置文件, 通常情况下我们会创建4个文件夹:res, resource, scene, scripts

res\resources: 放置资源文件相关

--[[
res:主要放置编译器所需要的静态资源
resources:主要放置动态加载的资源,即通过cc.loader.loadRes来加载的资源

如果不需要动态加载,就不要放置到resources文件夹中。
这样设置的原因主要是为了避免将所有资源放置在res中而导致打包后的包体文件settings.json过大。
--]]

scene:场景文件相关,文件夹中格式为.fire

scripts: 脚本文件相关

 

该配置文件在编译器中是不可见的,若对资源执行了删除等操作,都会由编译器自动同步。假设我们创建了game的场景文件,其配置信息为:

-- game.fire.meta 资源配置文件
{
  "ver": "1.2.7",
  "uuid": "9efb26cf-2a11-40fc-89bc-db4a1639e842",
  "asyncLoadAssets": false,
  "autoReleaseAssets": false,
  "subMetas": {}
}

--[[
ver: 
uuid: 资源的唯一标识,编译器在查找资源时通过uuid查找,我们也可通过该属性查找指定资源
asyncLoadAssets: 属性检查器中设定,是否延迟加载资源
autoReleaseAssets: 属性检查器中设定,是否自动释放资源
subMetas:
]]

 

IDE配置:

编写脚本可使用微软推出出的Visual Code,该编译器可轻松实现语法高亮,智能代码提示等功能。

下载地址:https://code.visualstudio.com/

安装成功后,在cocosCreator中的配置有:

1. 智能提示相关

开发者 -> VS Code工作流 -> 安装VS Code扩展, 控制台成功提示:VS Code extension installed to ...

开发者 -> VS Code工作流 -> 更新VS Code智能提示,控制台成功提示: API data generated and copied to ...

2. 设置默认编译器相关

CocosCreator -> 偏好设置 -> 数据编辑 -> 外部脚本编译器

设置为Visual Studio Code.app 这样可保证双击javaScript脚本从Vs Code中打开指定文件。

3. 设置VsCode目录文件显示和搜素过滤相关

Code -> 首选项 -> 设置,在搜索目录下输入“exclude”, 然后在

Files:Exclude中添加:

**/.git
**/.DS_Store
**/*.meta
library/
local/
temp/

Search:Exclude中添加:

**/node_modules
**/bower_components
build/
temp/
library/
**/*.anim

 


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM