{"record":{"id":"5d410d113f133879","repo":"moeru-ai/airi","slug":"failed-to-load-hdri-environment","errorCode":null,"errorMessage":"Failed to load HDRI environment:","messagePattern":"Failed to load HDRI environment:","errorType":"console","errorClass":null,"httpStatus":null,"severity":"warning","filePath":"packages/stage-ui-three/src/components/Environment/SkyBox.vue","lineNumber":143,"sourceCode":"      renderer as WebGLRenderer,\n      cubeRT,\n    )\n\n    // PBR IBL\n    environment.value = hdrTex\n    const scn = scene.value as Scene\n    scn.environment = rt.texture // drives PBR materials (Standard/Physical)\n    if (props.asBackground)\n      scn.background = rt.texture // optional: also show as background\n    // r152+: background controls (no-ops on older versions)\n    scn.backgroundBlurriness = props.backgroundBlurriness\n    scn.backgroundIntensity = props.backgroundIntensity\n\n    // emit irrSH for NPR IBL\n    emit('skyBoxReady', { irrSH: probe.sh })\n  }\n  catch (error) {\n    console.warn('Failed to load HDRI environment:', error)\n  }\n}\n\n// Usage in your component\nonMounted(async () => {\n  // load environment from sky box (default or user input)\n  await loadEnvironment(props.skyBoxSrc)\n\n  // hot switch: react to sky box change\n  watch(\n    // Actually we can also let user set background blurriness or intensity\n    // TODO: maybe we can open more options for users regarding to the settings of the background in the future\n    () => [props.skyBoxSrc],\n    ([skyBoxSrc]) => {\n      loadEnvironment(skyBoxSrc as string)\n    },\n    { deep: false },\n  )","sourceCodeStart":125,"sourceCodeEnd":161,"githubUrl":"https://github.com/moeru-ai/airi/blob/677329427f32468c74b17f3ec47eeca4e05bec65/packages/stage-ui-three/src/components/Environment/SkyBox.vue#L125-L161","documentation":"loadEnvironment turns the HDRI/sky box source into a PMREM environment texture, assigns it to scene.environment (and scene.background when asBackground), then emits skyBoxReady with the irradiance SH. Any throw — fetch failure, RGBE parse error, PMREM/WebGL failure — is caught and warned; the scene keeps running with no environment map, leaving PBR materials unlit or flat.","triggerScenarios":"skyBoxSrc returning 404 or CORS-blocked; the file is not a valid equirectangular .hdr; PMREM generation failing on a lost or limited WebGL context; a huge HDR exhausting memory on mobile.","commonSituations":"Typo in the skyBoxSrc path; assets moved without updating config; local or CORS-less hosting; 8K HDRs on mobile devices.","solutions":["Verify skyBoxSrc returns 200 with CORS headers (open it directly in the browser)","Use a valid equirectangular .hdr file; convert other formats first","Downscale large HDRIs for mobile targets to avoid PMREM OOM","Set a fallback scene.environment (e.g. a neutral color) in the catch so PBR is not unlit","Check for WebGL context loss if loading previously worked"],"exampleFix":null,"handlingStrategy":"try-catch","validationCode":"if (!props.skyBoxSrc) return // nothing to load; keep default lighting","typeGuard":null,"tryCatchPattern":"try {\n  const scn = scene.value as Scene\n  scn.environment = rt.texture\n  if (props.asBackground) scn.background = rt.texture\n  emit('skyBoxReady', { irrSH: probe.sh })\n}\ncatch (error) {\n  console.warn('Failed to load HDRI environment:', error)\n  // scene continues without IBL; optionally set a neutral fallback environment here\n}","preventionTips":["Serve .hdr assets over CORS-enabled URLs and verify 200 responses","Use valid equirectangular HDR files; other formats fail at parse","Downscale HDRIs for mobile to avoid PMREM OOM","Set a fallback environment in the catch so PBR materials are never unlit"],"tags":["three","hdri","skybox","pmrem","environment"],"backgroundTag":"hdri-load-failed","analyzedSha":"677329427f32468c74b17f3ec47eeca4e05bec65","analyzedAt":"2026-08-18T17:29:58.153Z","contentChangedAt":"2026-08-18T17:29:58.153Z","schemaVersion":2},"datasetVersion":"2026-09-14T05:17:10.506Z"}