引言哈喽大家好我是亿元程序员一位有着8年游戏行业经验的主程。很多Cocos开发者平时都会用插件但真正自己写过全局插件的小伙伴可能并不多。普通插件一般跟着项目走只服务当前项目。全局插件就不一样了它安装在Cocos Creator的全局扩展目录中只要你打开编辑器不管切换到哪个项目都可以使用同一套工具。这就非常适合沉淀一些通用能力。比如打开项目目录、启动本地工具、资源检查、Prefab批处理、构建辅助、小游戏包体分析等等。举个例子像下面这种发布辅助能力就非常适合放到全局插件里为什么这个例子适合做成全局插件因为它不是某个游戏玩法里的业务逻辑而是很多项目都可能用到的发布流程能力。今天项目A要上传到服务器明天项目B也要上传到服务器。如果每个项目都单独写一套上传按钮、分支前缀、预览地址配置后面维护起来就会很麻烦。但如果把它做成全局插件就可以在所有Cocos项目中复用同一套上传逻辑。这就是全局插件最有价值的地方把重复流程做成编辑器能力。言归正传本期我们手把手看下一个Cocos全局插件是怎么跑起来的估计90%的小伙伴都不知道~。全局插件放在哪里这里非常重要。如果是项目插件一般放在当前项目的项目目录/extensions但如果是全局插件就不能只放在某个项目里而是要放到Cocos Creator的全局扩展目录。以当前实战为例它所在的位置是这是Cocos Creator的全局扩展目录之一。放在这里的插件不绑定某一个游戏项目而是跟着当前Cocos Creator编辑器环境走。也就是说只要这个全局插件启用了你打开任意Cocos项目都可以在编辑器里看到它。如何让全局插件生效放对目录后插件没问题的话自动就会生效。如果插件加载成功就可以在顶部菜单的扩展菜单里看到对应入口本实战工程。甚至可以在扩展管理器的内置扩展找到我们的自定义全局插件如果修改了TypeScript代码还需要重新编译npmrun build最后回到Cocos Creator里重新加载插件我们可以在Load中加入输出如果启动项目有输出说明插件加载成功很多小伙伴插件没生效不是代码写错了而是放错目录或者改完忘记重新编译。实战工程结构实战工程是一个Cocos Creator 3.8.7的全局扩展示例主要结构如下globalext ├─ package.json ├─ tsconfig.json ├─ src │ └─ main.ts ├─ panels │ └─ default │ └─ index.ts └─ dist这几个文件分别负责不同事情package.json声明插件信息、菜单、面板和消息。src/main.ts插件主入口真正执行功能逻辑。panels/default/index.ts编辑器面板代码。distTypeScript编译后的运行代码。第一步声明这是一个插件首先看package.json。实战工程里有几个关键配置这里重点看两个字段name插件名这里叫globalext。main插件入口指向编译后的./dist/src/main.js。因为这是TypeScript工程所以我们平时写的是src/main.ts真正被Cocos Creator加载的是编译后的JS文件。执行构建命令npminstallnpmrun build编译完成后dist目录里就会生成编辑器实际加载的代码。第二步给全局插件加菜单插件通常用起来最直接的方式就是加菜单。实战工程在package.json里通过contributions.menu注册了多个菜单项这段配置的意思是在Cocos Creator顶部菜单的扩展菜单下放一个Happy Tools分组。菜单显示文字是“打开面板”。点击菜单后发送一条open-panel消息。注意菜单本身不负责执行逻辑只发送消息小伙伴们这是什么模式第三步把菜单消息绑定到方法同样在package.json中可以看到消息映射这里的意思是收到open-panel消息就调用openPanel方法。收到open-assets消息就调用openAssets方法。收到print-project-path消息就调用printProjectPath方法。这就是Cocos插件里非常核心的一条链路菜单点击 - 发送 message - 调用 main.ts 里的 methods 方法理解这条链路后大部分编辑器插件功能都能写出来。第四步编写插件主入口接下来看src/main.ts。当前工程里导出了一个methods对象就是具体的方法实现举例几个方法openPanel打开插件面板。openAssets打开当前项目的assets目录。printProjectPath打印当前Cocos项目的路径。第五步做一个自定义面板只有菜单还不够直观所以实战工程还做了一个自定义面板。面板声明在package.json里这里说明插件有一个默认面板标题是Happy Tools。类型是dockable可以停靠在编辑器里。入口是./dist/panels/default。然后在panels/default/index.ts里定义界面第六步面板按钮调用主入口和菜单一样面板本身也不直接处理复杂逻辑。它通过Editor.Message.request去调用主入口里的方法这里的globalext就是插件名。完整调用链路是点击面板按钮Editor.Message.request(globalext, open-assets)package.json 找到 open-assets调用 main.ts 里的 openAssets打开当前项目 assets 目录到这里一个完整的全局插件功能就跑通了。第七步常用功能其实我们用全局插件的目的就是为了把经常用到的功能更加容易使用。例如一键启动Cocos MCP Server(前提是要先安装Cocos Mcp)。用Codex打开当前项目。构建完成后上传到服务器。自动生成线上预览地址等等。全局插件 外部命令其实就能把很多零散工具都收进Cocos编辑器。更进一步基于这个工程后续可以继续扩展很多功能。比如扫描所有Prefab检查Label字体是否正确。扫描assets目录统计图片、音频、字体大小。打包前检查主包资源是否超标。一键打开项目的配置表目录。一键压缩资源。一键精简字库。这些功能如果写在单个项目里只能服务一个项目。但如果写在全局插件里就可以服务你所有的符合版本的Cocos项目。这就是全局插件最大的价值把一次经验变成长期工具。结语本文最主要的目的不是带大家回归古法编程而是分享给大家经验。毕竟在AI时代经验可能比技术更重要。小伙伴们觉得对吗可在评论区分享你的看法~本文实例工程可通过私信发送“全局插件”获取。我是亿元程序员一位有着8年游戏行业经验的主程。在游戏开发中希望能给到您帮助也希望通过您能帮助到大家。实不相瞒想要个赞和爱心请把该文章分享给你觉得有需要的其他小伙伴。谢谢推荐文章亿元Cocos小游戏实战合集2.0亿元Cocos小游戏实战合集1.0老板说最近这款游戏很火让我抄可是我连玩都玩不明白…这款值68亿的游戏你不实战一下吗安排小伙伴说我的拼图游戏用Mask不能合批…俄罗斯方块谁不会做…啊流沙版最近很火的一个拼图游戏老板让我用Cocos3.8做一个…老板说拼图游戏太卷了让我用Cocos做个3d版本的…敢不敢挑战用Cocos3.8复刻曾经很火的割绳子游戏
