Panuchka

Importing Canvas2D to project

Recommended Posts

I am struggling with a similar problem like in this thread, but the solution provided here seems not so ideal...

I have many modules in my game, and if I use Babylon.js in any of those, I import it using:

import Babylon from 'babylonjs'

So there isn't any good way to include Canvas2D similarly? I understand it is somehow baked to Babylon.js, but how do I use it? I'm downloading all the dependencies from the npm, including Babylon.js. Then I bundle everything using Webpack.

Ideally, I would like to use Canvas2D (for example) like this:

import Babylon from 'babylonjs'
import Canvas2D from 'babylonjs'

Please help, I've been scratching my head for hours now...

Share this post


Link to post
Share on other sites

If you are using NPM, I don't think 'babylonjs' includes Canvas2D. Canvas2D is a separate file that you can get from here: https://github.com/BabylonJS/Babylon.js/tree/master/dist

I've been scratching my head for days, so 'hours' isn't so bad!!  Even if you get the import Canvas2D then I suspect you will get issues with loading.  If you get it working, please let us know how.  Cheers.

Share this post


Link to post
Share on other sites

Also, maybe you have done it to simplify your imports, but if you use explicit imports (instead of default) might be a good practice.
ie: import { Mesh, Vector3, Color3 } from 'babylonjs'

Since you are using webpack, explicit imports will reduce the size of your generated javascript.  If your editor has ESLint then it will pickup on unused/missing imports.

Share this post


Link to post
Share on other sites

Is there ETA for 3.0?
If the full release is far far away in the future, could we have 3.0 alpha/beta builds in npm too? Or include Canvas2D for 2.5?

If I can't get this to work, I guess I have to do the UI using html/css :( I would prefer using just Babylon.js though, with Canvas2D.

Share this post


Link to post
Share on other sites

I'm facing a similar issue but trying to import the glTF File Loader,
Would it be okay to include the loaders in the npm package aswell?
Or would it be better to have a separate npm repository for the plugins?

If making them available through npm isn't an option, Is there some way to import the SceneLoader from the glTF loader?

In a es2015 project - glTF loader worked fine following the tutorials ( by including it as a script in index.html)
but with a typescript project the same thing isn't working

Is there a recommended way to "import" a babylonjs plugin?

Thanks
 

Share this post


Link to post
Share on other sites

i don't know a recommended way, but I just copied the .ts file from babylonjs source and modified it be removing any "BABYLON." references. Then my code was just this:

SceneLoader.RegisterPlugin(new OBJFileLoader())
        
SceneLoader.ImportMesh(...)

Anyway, I'm sure this isn't the recommended way, but will get you going until you find something hopefully better.

Share this post


Link to post
Share on other sites

It is not removed. Just moved to Extensions repo.

Canvas2D is still a great framework but the main contributor is sick so I needed to remove Canvas2D from the main repo to not block the release of Babylon.js 3.0

So yes we will definitely keep both.

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now


  • Recently Browsing   0 members

    No registered users viewing this page.