Phaser是一个简单易用且功能强大的html5游戏框架。
其实一点也不简单。虽然是js开发，但事实上您可以将项目发布到任何平台。
由于功能实在是太多，如果要降低Phaser的文件大小（880kb），我们可以自定义Phaser库的构建，指南https://medium.com/@louigi.verona/reducing-phasers-filesize-custom-phaser-builds-4a0314819a38
以下为译文（摘要）
第一步：git clonehttps://github.com/photonstorm/phaser3-custom-build
第二步：初始化设置，进目录执行npm install，如果遇到问题执行npm audit fix，最后更新phaser库，执行 npm update phaser
第三步：构建
构建命令格式为npm run [ALIAS]。[ALIAS]部分决定了你要构建哪个版本，dist是构建的默认目标目录。
npm run buildcore
npm run buildfull
...
第四步 构建自定义版
复制phaser-full.js的内容到phaser-custom.js。它的完整内容是
require(‘polyfills’); var CONST =require(‘const’); var Extend = require(‘utils/object/Extend’); /** * @namespace Phaser */ var Phaser ={ Actions: require(‘actions’), Animations: require(‘animations’), Cache: require(‘cache’), Cameras: require(‘cameras’), Core: require(‘core’), Class: require(‘utils/Class’), Create: require(‘create’), Curves: require(‘curves’), Data: require(‘data’), Display: require(‘display’), DOM: require(‘dom’), Events: require(‘events/EventEmitter’), Game: require(‘core/Game’), GameObjects: require(‘gameobjects’), Geom: require(‘geom’), Input: require(‘input’), Loader: require(‘loader’), Math: require(‘math’), Physics: require(‘physics’), Plugins: require(‘plugins’), Renderer: require(‘renderer’), Scale: require(‘scale’), Scene: require(‘scene/Scene’), Scenes: require(‘scene’), Sound: require(‘sound’), Structs: require(‘structs’), Textures: require(‘textures’), Tilemaps: require(‘tilemaps’), Time: require(‘time’), Tweens: require(‘tweens’), Utils: require(‘utils’) }; Phaser = Extend(false, Phaser, CONST); module.exports =Phaser; global.Phaser = Phaser;
执行npm run build，build这个别名的配置就依赖于 “phaser-custom.js”。
开始自定义，举个例子，如项目是一个2D的棋牌游戏，我们就不需要任何物理引擎，从Phaser对象中安全的移除它。
//Physics: require(‘physics’),
第五步 清理Loader 和 GameObjects
大多数情况下，我们不需要所有的文件类型。
首先是处理GameObjects，在项目目录的/node_modules/phaser/src/gameobjects/下我们可以看到完整的GameObjects，每个目录代表一类game object
假设我们要在假如Image Sprite Text这几种game object，我们可以将GameObjects: require(‘gameobjects’)替换为
GameObjects: { DisplayList: require(‘gameobjects/DisplayList’), UpdateList: require(‘gameobjects/UpdateList’), Image: require(‘gameobjects/image/Image’), Sprite: require(‘gameobjects/sprite/Sprite’), Text: require(‘gameobjects/text/static/Text’), Factories: { Image: require(‘gameobjects/image/ImageFactory’), Sprite: require(‘gameobjects/sprite/SpriteFactory’), Text: require(‘gameobjects/text/static/TextFactory’) }, Creators: { Image: require(‘gameobjects/image/ImageCreator’), Sprite: require(‘gameobjects/sprite/SpriteCreator’), Text: require(‘gameobjects/text/static/TextCreator’) }}
然后是Loaders，替换Loader: require(‘loader’),
Loader: { FileTypes: { ImageFile: require(‘loader/filetypes/ImageFile’), AudioFile: require(‘loader/filetypes/AudioFile’), SpriteSheetFile: require(‘loader/filetypes/SpriteSheetFile’), ScriptFile: require(‘loader/filetypes/ScriptFile’) }, LoaderPlugin: require(‘loader/LoaderPlugin’) }
注意最后的结构中的LoaderPlugin，但其他类型还可能需要其他自定义的扩展，完整的文件类型可在/node_modules/phaser/src/loader/filetypes/下查看。
phaser-custom.js例子
require(‘polyfills’); var CONST =require(‘const’); var Extend = require(‘utils/object/Extend’); /** * @namespace Phaser */ var Phaser ={ Actions: require(‘actions’), Animations: require(‘animations’), Cache: require(‘cache’), Cameras: require(‘cameras’), Core: require(‘core’), Class: require(‘utils/Class’), Create: require(‘create’), Display: require(‘display’), Events: require(‘events/EventEmitter’), Game: require(‘core/Game’), //GameObjects: require(‘gameobjects’), GameObjects: { DisplayList: require(‘gameobjects/DisplayList’), UpdateList: require(‘gameobjects/UpdateList’), Group: require(‘gameobjects/group/Group’), Image: require(‘gameobjects/image/Image’), Sprite: require(‘gameobjects/sprite/Sprite’), Text: require(‘gameobjects/text/static/Text’), Factories: { Group: require(‘gameobjects/group/GroupFactory’), Image: require(‘gameobjects/image/ImageFactory’), Sprite: require(‘gameobjects/sprite/SpriteFactory’), Text: require(‘gameobjects/text/static/TextFactory’) }, Creators: { Group: require(‘gameobjects/group/GroupCreator’), Image: require(‘gameobjects/image/ImageCreator’), Sprite: require(‘gameobjects/sprite/SpriteCreator’), Text: require(‘gameobjects/text/static/TextCreator’) } }, Input: require(‘input’), Loader: { FileTypes: { ImageFile: require(‘loader/filetypes/ImageFile’), AudioFile: require(‘loader/filetypes/AudioFile’), SpriteSheetFile: require(‘loader/filetypes/SpriteSheetFile’), ScriptFile: require(‘loader/filetypes/ScriptFile’) }, LoaderPlugin: require(‘loader/LoaderPlugin’) }, Plugins: require(‘plugins’), Renderer: require(‘renderer’), Scale: require(‘scale’), Scene: require(‘scene/Scene’), Scenes: require(‘scene’), Sound: require(‘sound’) }; Phaser = Extend(false, Phaser, CONST); module.exports =Phaser; global.Phaser = Phaser;
结论
自定义可以帮助你把不需要的模块都去掉，作者就将880k减到了450k。