npm install
npm run serve
npm run build
npm run lint
Dev tools and debug code can be enabled by setting the VUE_APP_DEBUG
environment flag to true
. Ifdef-loader is used to ensure no debug code remain in production. To add debug code make sure to wrap it inside a /// #if DEBUG
... /// #endif
block.
Note : You can use Gui
and DebugDraw
features outside DEBUG block. They are removed from production but but replaced by dummy/noop implementation
The module gui
provide a way to add DatGui like controls (using Tweakpane). It's available even when DEBUG is disabled, but replaced by noop dummy. Decorators are also provided for convenience.
Some examples are available here
The renderer have initilly 2 cameras, a main camera and a debug one. You can switch camera in the Gui. The Debug camera provide 2 different control scheme (3DSMax and Blender) you can change the scheme in the .env files by editing VUE_APP_DEV_CAMERA_SCHEME
var.
Glsl can be imported as modules, and provide HMR fonctionnalities.
The Minimal drawcall sample create a program which recompile when the glsl file are edited. The Disolve FX show how to implement shader HMR when using shader Chunk on materials
Textures and Gltfs can be loaded as Resource objects. ( See the resources API src/resources
).
- A
Resource
manage it's loading lifecycle. It can be loaded, cancelled and unloaded. See a basic loading the Minimal Sample, anf more advanced cancellation managment in Cancelation Sample - Resources can be grouped in ResourceGroup to simplify loading of multiple resources
- TextureResources implement the source-set concept. Various formats of a texture can be provided. The first one available will be used. This is managed automatically for textures in the
src/assets
folder, loaded withAssetDatabase.getTexture()
. - Currently supported texture formats are jpg, png, webp, basis, etc1(ktx), dxt5/bc3(ktx), pvrtc(ktx)
TextureResources
created usingAssetDatabase.getTexture()
provide HMR functionality. They can be edited and hot reloaded. See the Minimal Sample. Note that only jpg/png version is reloaded.
The project is setup to support 2 formats of Ibl textures.
- A PMREM format: 256x256, RGBM16, 5 mip levels. Loaded as 30 webp or png files. Only supported on Webgl2
- A 2:1 ration octahedral format (OCTA): 8levels of 512x256 RGBM16, assembled in a single 512x2048 texture (webp/png). Used as fallback
Additionaly, Irradiance data is provided as a 3 bands Spherical Harmonics in a txt file.
API:
Ibl
: represent an IBL in a LightSetup
, can be added like other Punctual Lights. A LightSetup
suport only one Ibl.
IblResource
: a Resource<Ibl>
to help you load Ibls. It handle octa/pmrem and png/webp switch based on capabilities.
Examples: PmremIblSample and OctaIblSample