Getting typescript setup

[josharrr]

I'm trying to figure out how to get typescript to recognize Babylon. My folder structure looks like this:

app
-assets
--babylon.d.ts
--babylon.js
-game
--game-model.ts

In game-model.ts I'm using this:

///<referance path="../assets/babylon.d.ts" />
import * as BABYLON from 'BABYLON'; 

But when I try to build I get this error:

client/dev/app/game/game-model.ts(2,26): error TS2307: Cannot find module 'BABYLON'.

I know that it's finding the babylon.d.ts file because it's not giving me an error on that now.

Maybe there's an easier way to do this using typings but I'm not finding babylon when I do `typings search babylonjs`.

I'd appreciate any help. I'm pretty new to typescript. Used it in one other project but wasn't importing 3rd party JS.

Thanks!

[Fairydhwen]

Hey, 

can we have a link to your babylon.d.ts file pls?

Fairy

[Dal]

Modules and references is one of the most confusing and badly explained features of typescript... I really hope they do more to make it easier to understand in future.

From what I can see, it looks like you're mixing up your import syntax. The ///reference line tells the IDE and compiler a definitions file to use when working with the .js file. The "import *" syntax is for telling the code to import a typescript module from a file called BABYLON - that's a path, not just an alias. So unless there's a BABYLON.ts or BABYLON.d.ts file in the same directory, it won't find it.

In your case, you probably don't need the import line at all... just having the reference path to the .d.ts file should be enough for it to pick up the definitions and compile. To make it even easier, just use Visual Studio or VS Code and use a tsconfig.json file in the root:
https://code.visualstudio.com/Docs/languages/typescript

Once you have your tsconfig.json set up, you won't need to manually add references to all the .ts files you add, they will just be included automatically.

[JCPalmer]

Knowing how an individual IDE handles Typescript setup is all that is required.  For Eclipse wt Palantir Typescript add-in, you just define your source directory(ies).  If a d.ts is one of those, job done.  It uses references to order the output for the class files it actually compiles, in the case where the output is a single file rather than a directory hierarchy.  For outputs much less complex than BJS, references save a lot of time trying to figure out what order things have to be for Javascript.

I am doing both Typescript & python in this project.  It can build both.  I also have my own Ant build processes to minify / Gulp the .js file, and zip all my .py files for Tower of Babel Blender Add-in.  I even have Java in this project to build to read / convert the Arpabet database to javascript.

 

[josharrr]

@Fairydhwen Here's the d.ts I'm using: https://github.com/BabylonJS/Babylon.js/blob/master/dist/preview%20release/babylon.d.ts

 

@Dal @JCPalmer Sure enough, when I took out the import statement I stopped getting that error. I also just had to restart Visual Studio Code for intellisense to pick up on the reference line. Thank you for the advice!

[Fairydhwen]

Looks like your babylon.d.ts doesn't have any export.

[JCPalmer]

If you are trying to export BJS scenes to something else, you are on your own.  The exports in the repo are actually from somewhere else to BJS.  They are written in a language needed for that environment, eg. python or C#.  d.ts files only describe typescript / Javascript files.