Skybox removed after loading model in v4.x but not in v5 alpha

Darcey · September 10, 2021, 2:27pm

Anyone got a fix for this?

https://www.babylonjs-playground.com/#WGZLGJ

Top right, change to v4.2 and you loose the skybox.

I tried using CreateBox(“skybox”) etc etc usuall stuff after loading the model and then the model disappears.

Ideas?

sebavan · September 10, 2021, 2:46pm

I suspect a bug would have been fixed around createDefaultSkybox

Why not using 5.0 preview ?

Darcey · September 10, 2021, 2:53pm

is V5.0.0-alpha.43 alpha stable enough for commercial use?

Mobile & Desktop.

sebavan · September 10, 2021, 3:31pm

Yup all our versions on npm are meant to be stable.

Being in alpha is only risky if you rely on new feature which are currently in development as the code might change but features which were present before should be back compatible and still stable usually even more

Darcey · September 10, 2021, 4:02pm

Just updated to:

“babylonjs”: “^5.0.0-alpha.44”,
“@babylonjs/core”: “^5.0.0-alpha.44”,
“@babylonjs/gui”: “^5.0.0-alpha.44”,
“@babylonjs/inspector”: “^5.0.0-alpha.44”,
“@babylonjs/loaders”: “^5.0.0-alpha.44”,
“@babylonjs/materials”: “^5.0.0-alpha.44”,
“@babylonjs/post-processes”: “^5.0.0-alpha.44”,
“@babylonjs/serializers”: “^5.0.0-alpha.44”,

tsconfig then errors with:

Cannot find type definition file for ‘babylonjs-gui’.
The file is in the program because:
Entry point of type library ‘babylonjs-gui’ specified in compilerOptions
Duplicate of above

So I removed tsconfig types entry “babylonjs-gui”

Then tsconfig errors with:
Cannot find type definition file for ‘babylonjs-materials’.
The file is in the program because:
Entry point of type library ‘babylonjs-materials’ specified in compilerOptions

So I removed that also… No errors with tsconfig just having “babylonjs” added to the types array.

Ran build, 193+ errors…

Removed all imports by specific class/function for:
import * as BABYLON from ‘babylonjs’;
Added BABYLON. to everything that was new Mesh, new Vector3 etc etc

Identical to:
https://www.babylonjs-playground.com/#WGZLGJ

Bar the path to the model and its related assets, I commented out
// scene.activeCamera.alpha += Math.PI;

Now results in:

Warning:
Unable to find a plugin to load .gltf files. Trying to use .babylon default plugin. To load from a specific filetype (eg. gltf)

Error:
Unable to load from ./assets/models/boombox/BoomBox.gltf: loadAssets of unknown
Materials:
Name: BoomBox_Mat

Where as it loaded in v4.2

sebavan · September 10, 2021, 5:07pm

Why do you have “babylonjs”: “^5.0.0-alpha.44” ??? it should not be there if you use @babylonjs/xxx

Darcey · September 12, 2021, 7:54pm

npm i -S babylonjs@latest
Generates the following in package.json
“babylonjs”: “^4.2.0”

npm i -S babylonjs@5.0.0-alpha.44
Generates the following in package.json
“babylonjs”: “^5.0.0-alpha.44”

npm i -S babylonjs@preview
Generates the following in package.json
“babylonjs”: “^5.0.0-alpha.44”,

That’s what I was asking about… I was using version 4.2, you stated that the alpha is stable (not sure you should call an alpha or beta stable but if you say it is).

However code using alpha 44 resulted in errors… I will see if I can resolve them, if not… Will post some more probably.

sebavan · September 13, 2021, 12:07pm

The error results from resolving wrong babylonjs-gui package which should not happen if only @babylonjs/xxx packages were present but here you have this entry in your dependency “babylonjs”: “^5.0.0-alpha.44”, and this should not be here as you can not matched bundle and unbundled packages.

Darcey · September 13, 2021, 12:44pm

All packages were at same version that I included, that’s just line 1 of each set of the npm installs, but if you want to see the whole install scripts:

// Install v4.2
npm i -S babylonjs@latest
npm i -S @babylonjs/core@latest
npm i -S @babylonjs/inspector@latest
npm i -S @babylonjs/loaders@latest
npm i -S @babylonjs/materials@latest
npm i -S @babylonjs/gui@latest
npm i -S @babylonjs/serializers@latest
npm i -S @babylonjs/post-processes@latest
npm i -S @babylonjs/controls@latest (error)
npm i -S @babylonjs/viewer@latest

// Install manually v5 alpha 44 directly (finding latest versions on nmpjs)
npm i -S babylonjs@5.0.0-alpha.44
npm i -S @babylonjs/core@5.0.0-alpha.44
npm i -S @babylonjs/inspector@5.0.0-alpha.44
npm i -S @babylonjs/loaders@5.0.0-alpha.44
npm i -S @babylonjs/materials@5.0.0-alpha.44
npm i -S @babylonjs/gui@5.0.0-alpha.44
npm i -S @babylonjs/serializers@5.0.0-alpha.44
npm i -S @babylonjs/post-processes@5.0.0-alpha.44
npm i -S @babylonjs/controls@1.0.0-alpha.22 // odd one out
npm i -S @babylonjs/viewer@5.0.0-alpha.44

// Preview (gets the latest alpha, ends up the same as above at the moment)
npm i -S babylonjs@preview
npm i -S @babylonjs/core@preview
npm i -S @babylonjs/inspector@preview
npm i -S @babylonjs/loaders@preview
npm i -S @babylonjs/materials@preview
npm i -S @babylonjs/gui@preview
npm i -S @babylonjs/serializers@preview
npm i -S @babylonjs/post-processes@preview
npm i -S @babylonjs/controls@preview (error)
npm i -S @babylonjs/viewer@preview

And if I have:
“@babylonjs/core”: “^5.0.0-alpha.44”,
“@babylonjs/gui”: “^5.0.0-alpha.44”,
“@babylonjs/inspector”: “^5.0.0-alpha.44”,
“@babylonjs/loaders”: “^5.0.0-alpha.44”,
“@babylonjs/materials”: “^5.0.0-alpha.44”,
“@babylonjs/post-processes”: “^5.0.0-alpha.44”,
“@babylonjs/serializers”: “^5.0.0-alpha.44”,
“@babylonjs/viewer”: “^5.0.0-alpha.44”,

I get:
webpack 5.52.1 compiled with 190 errors in 56 ms. So I then delete all the imports go through everything CTRL + SPACE (VSCode) to intelisense find the import and get them back in and get errors such as:

ERROR in ./src/controllers/App.ts 21:17-52
Module not found: Error: Can’t resolve ‘babylonjs/Engines/engine’ in ‘W:\www\Dev\WebGL\Templates\BabylonTS\src\controllers’

However VSCode has resolved:
import { Engine } from “babylonjs/Engines/engine”;

And the following code show no errors:
private engine: Engine;
this.engine = new Engine(this.canvas, true);

However if I use:
import * as BABYLON from ‘babylonjs’;

Adjust everything to have BABYLON. in front of everything like scene, engine, vector3 etc etc, it works.

And if I have:
“@babylonjs/controls”: “^1.0.0-alpha.1”,
“@babylonjs/core”: “^4.2.0”,
“@babylonjs/gui”: “^4.2.0”,
“@babylonjs/inspector”: “^4.2.0”,
“@babylonjs/loaders”: “^4.2.0”,
“@babylonjs/materials”: “^4.2.0”,
“@babylonjs/post-processes”: “^4.2.0”,
“@babylonjs/serializers”: “^4.2.0”,
“@babylonjs/viewer”: “^4.2.0”

I get no errors but there are issues like the hdr scene.createDefaultEnvironment being lost after a model is loaded.

I just don’t typically ever use import * often, ever actually, only lib I use that is with babylon v5 alpha (now).

Darcey · September 13, 2021, 1:15pm

Also if I use v5 and just import * as BABYLON from ‘babylonjs’;

I can no longer get GLB files to load, errors with:
Unable to import meshes from /Dev/WebGL/Templates/BabylonTS/dist/assets/models/Lg_3.glb: importMesh of undefined from undefined version: undefined, exporter version: undefinedimportMesh has failed JSON parse

And the classic warning of:
Unable to find a plugin to load .glb files. Trying to use .babylon default plugin. To load from a specific filetype (eg. gltf) see: https://doc.babylonjs.com/how_to/load_from_any_file

And the use of:
// import “@babylonjs/loaders”;
// import “@babylonjs/core/Loading”;
// import “@babylonjs/loaders/glTF”;
Both all result in error…

Know what to import now to get GBL working again?

sebavan · September 13, 2021, 2:25pm

You are still mixing some incompatible packages which is creating the issue Could you share your repo even in PM so that I can have a look ?

Darcey · September 13, 2021, 2:38pm

gist.github.com

https://gist.github.com/DarceyLloyd/552d3a7fe88d54bf15cf5cb3534052a5

App.ts

import { log } from "aftc-modules/src/debug/log";

import * as BABYLON from 'babylonjs';
import 'babylonjs/loaders';

import gsap from "gsap/all";
import { attachDebug } from "aftc-modules/src/debug/attachDebug";
import { debugTo } from "aftc-modules/src/debug/debugTo";
import { AttachKeysToVec3 } from "../utils/AttachKeysToVec3";
// - - - - - - - - - - - - -

This file has been truncated. show original

package.json

{
  "name": "babylonts",
  "description": "",
  "version": "1.0.0",
  "main": "babel.config.js",
  "scripts": {
    "start": "webpack-dev-server",
    "build": "webpack --mode=production",
    "buildDev": "webpack --mode=development",
    "serve": "webpack serve"

This file has been truncated. show original

Darcey · September 13, 2021, 2:43pm

If I remove all other npm installs for just babylonjs@preview and use:

import * as BABYLON from ‘babylonjs’;
import “babylonjs/loaders”;

I get error:
Cannot find module ‘babylonjs/loaders’

sebavan · September 13, 2021, 2:50pm

You need to:
npm i -s babylonjs
npm i -s babylonjs-loaders

sebavan · September 13, 2021, 2:52pm

babylonjs-loaders - npm is the loaders package for babylonjs - npm

Darcey · September 13, 2021, 2:52pm

Wont that give me version 4.3 not v5 alpha 44?

sebavan · September 13, 2021, 2:54pm

yup you do:

npm i -s babylonjs@preview
npm i -s babylonjs-loaders@preview

Darcey · September 13, 2021, 2:55pm

Just done that testing now…

Darcey · September 13, 2021, 3:09pm

ok, that’s working… Nice one.

But somewhere along the line both with old version and new, the model is now flickering…

Note: 50mb model, so takes its time to load, mouse drag cam to left and you will see model flickering…
https://aftc.io/test/

Any ideas?

Mouse look and AWSD are enabled.

I’ve updated the gist with what code I have now also.

Thanks

D

sebavan · September 13, 2021, 3:13pm

The jitter looks like z fighting to me like there are several models on top of each others.

Topic		Replies	Views
Failing to Load Babylon Modules & 3DModels Questions blender , tutorial , gui , material	5	1998	October 28, 2019
4.0-alpha Error Questions	4	885	March 12, 2019
Bumped to alpha.63 - errors when compiling Bugs	4	283	December 6, 2021
Can build v4.2, but not v5.0...why not? Questions	22	2673	March 31, 2022
New problem with Typescript and babylonjs-gui Questions gui	5	206	June 27, 2023

Skybox removed after loading model in v4.x but not in v5 alpha

Related Topics