Set up typescript with babylon

Questions
1

Heya, currently I do this:

import * as B from ‘babylonjs’

So babylon is in my bundle. And babylon never changes, but I do a new bundle a few times a day, so the CDN is refetching the same stuff, and the bundle is huge.

Can I set up typescript so that it knows that “B” is “BABYLON”, but babylon loads like this:

<script src="//cdn.cryptovoxels.com/babylon-3.3.0.js">

And then my bundle doesn’t explicitly import babylon? Or maybe I can do some browserify magic so that babylon is excluded from the bundle and instead the import statements are rewritten to reference window.BABYLON?

Sorry it’s late if I’m not making sense.

1 Like
2

You can tell typescript to use Babylon as an ambient module with the types parameter in your tsconfig.json

  "compilerOptions": {
    "types" : [
      "babylonjs"
    ],
    "lib" : [
      "dom",
      "es2015",
      "es2015.promise"
    ]
  }
}

Babylon must be visible for typescript, with a npm install --save-dev babylonjs for example.

Once types parameter is set the BABYLON namespace is available in your module without importing it.

Remove import * as B from ‘babylonjs’ from your code then babylon won’t be build with your module.

1 Like
3

A good read: ES6 - Babylon.js Documentation