starting BJS + TS + Sublime Text

[jerome]

Hi,

 

Big jump into Typescript for me.

 

I guess I can learn fast the language, but I need help to set up the environment/context regarding to BJS.

I started reading tutos and so on about the syntax itself.

 

I use SublimeText 2 editor on Linux Ubuntu 14.04. I set it up to use TypeScript by adding this module : https://github.com/Railk/T3S

npm, typescript, tss are installed.

 

So ?

What do I have to do then ?

I tried to compile a js script file renamed in .ts ... it just couldn't find the name 'BABYLON' which is written everywhere in my code

I guess TS will check for lib/module dependencies. So how do I specify them, etc ?

Are the ds files some description files with all BJS API declarations embedded ? How to use them with SublimeText2 ?

 

Any links, tutos or posts about these usages (not TS syntax I can learn) are welcome.

 

Heeeeeeelp ... arg

[julien-moreau]

When you compile, you must compile ts files with ts code inside.

The compilation creates the related pure .js files starting from the .ts files

 

You can find the definition file (.d.ts) here: https://github.com/BabylonJS/Babylon.js named babylon.2.0.d.ts

 

The problem is I don't know how to use it with sublime text

You can use grunt to compile your files and create a command line in your sublime text project.

 

I hope someone else will help you more

[jerome]

Yep I understand well about ts file with ts code aaarff...

I just wanted to see how pure js would be compiled.

As ts is a superset of js, vanilla js is correct (valid) ts, isn't it ?

When doing this, the compiler can't understand every BABYLON word. So I guessed it checked the dependencies.

Do you start with some import clause or something equivalent to tell your code : "this BABYLON object is known somewhere else" ?

[RaananW]

Hi Jerome,

 

try adding a reference to the babylon.d.ts file at the beginning of the file your are trying to compile:

///<reference path="./location/babylon.d.ts"/>

and try to compile using tsc.

 

Typescript is a superset of javascript (pure-vanilla style :-) ) , but during the compilation it is type safe - it will search for the babylon references, and if they are not found it will throw an error. Just like in your case. This reference is telling the compiler where to find the definitions of the classes you are using (declarations, more correctly). Similar to including a header file in c (similar concept, works totally different thou).

[jerome]

aaah, my idol's answer

Thank you, it was right the explanation I needed !

I test it asap

[jerome]

It works !!!

I used the babylon1.14 description file because the 2.0 one gave me errors (cannot find AudioNode, GainNode, etc)

[RaananW]

Perfect!

AudioNode, GainNode and the rest of the friends are in an external .d.ts file (is in the References directory in github - https://github.com/BabylonJS/Babylon.js/tree/master/References ) . Include them as a reference and you can use babylon 2.0

[jerome]

Gourgl :blink:

I didn't notice, pfff, feeling so stupid

///<reference path="../Babylon.js/babylon.2.0.d.ts"/>///<reference path="../Babylon.js/References/poly2tri.d.ts"/>///<reference path="../Babylon.js/References/waa.d.ts"/>

now, it's working

 

thank you

[RaananW]

That's why we are all here! to help and learn from others :-)

[jerome]

Danke schön

[JCPalmer]

It works !!!

I used the babylon1.14 description file because the 2.0 one gave me errors (cannot find AudioNode, GainNode, etc)

incase you need something in 2.0, here is waa.d.ts link.  Web Audio is referenced inside of Babylon.

 

https://github.com/borisyankov/DefinitelyTyped/blob/master/webaudioapi/waa.d.ts

[JCPalmer]

Wait, there is now also poly2tri.d.ts.  Both can be found in repository References sub-directory, waa there is old though.

[jerome]

mmhh...

as I just couldn't compile on my office computer maybe because wrong preinstallation, I got my old laptop at home.

Ubuntu 14.04, nodejs freshly installed and updated (n stable), typescript installed, gulp installed.

 

So let's go.

I just cloned the original BJS repo (v2.0 stable) : git clone etc

Then

cd Babylon.js/Tools/Gulp

then I simply followed this wiki page : https://github.com/BabylonJS/Babylon.js/tree/master/Tools/Gulp

npm installnpm update

Right, 'til now, everything is ok.

Now, I'm going to simply to compile what I just got. Should work, nope ?

gulp typescript-to-js

iirrrrrrkkkk 

[21:48:32] Using gulpfile /var/www/BJS/Babylon.js/Tools/Gulp/gulpfile.js[21:48:32] Starting 'typescript-to-js'...[21:48:33] Compiling TypeScript files using tsc version null[21:48:39] [tsc] > /var/www/BJS/Babylon.js/Babylon/Materials/Textures/babylon.videoTexture.ts(36,24): error TS2339: Property 'src' does not exist on type 'HTMLElement'.[21:48:39] [tsc] > /var/www/BJS/Babylon.js/Babylon/Mesh/babylon.mesh.ts(884,53): error TS2345: Argument of type 'number[]' is not assignable to parameter of type 'Uint8Array'.[21:48:39] [tsc] > /var/www/BJS/Babylon.js/Babylon/Mesh/babylon.mesh.ts(1217,122): error TS2345: Argument of type 'number[]' is not assignable to parameter of type 'Uint8Array'.[21:48:39] [tsc] > /var/www/BJS/Babylon.js/Babylon/Tools/babylon.database.ts(260,58): error TS2339: Property 'error' does not exist on type 'Element'.[21:48:39] [tsc] > /var/www/BJS/Babylon.js/Babylon/Tools/babylon.database.ts(379,50): error TS2339: Property 'error' does not exist on type 'Element'.[21:48:39] [tsc] > /var/www/BJS/Babylon.js/Babylon/Tools/babylon.database.ts(510,58): error TS2339: Property 'error' does not exist on type 'Element'.[21:48:39] [tsc] > /var/www/BJS/Babylon.js/Babylon/Tools/babylon.tools.ts(288,35): error TS2339: Property 'result' does not exist on type 'EventTarget'.[21:48:39] [tsc] > /var/www/BJS/Babylon.js/Babylon/Tools/babylon.tools.ts(297,35): error TS2339: Property 'result' does not exist on type 'EventTarget'.[21:48:39] [tsc] > /var/www/BJS/Babylon.js/Babylon/Tools/babylon.tools.ts(509,32): error TS2339: Property 'set' does not exist on type 'number[]'.[21:48:40] Failed to compile TypeScript: Error: tsc command has exited with code:2 events.js:85      throw er; // Unhandled 'error' event            ^Error: Failed to compile: tsc command has exited with code:2    at /var/www/BJS/Babylon.js/Tools/Gulp/node_modules/gulp-tsc/index.js:51:33    at /var/www/BJS/Babylon.js/Tools/Gulp/node_modules/gulp-tsc/lib/compiler.js:360:8    at Array.forEach (native)    at Function.Compiler._allAborted (/var/www/BJS/Babylon.js/Tools/Gulp/node_modules/gulp-tsc/lib/compiler.js:359:13)    at Function.Compiler.abortAll (/var/www/BJS/Babylon.js/Tools/Gulp/node_modules/gulp-tsc/lib/compiler.js:337:14)    at /var/www/BJS/Babylon.js/Tools/Gulp/node_modules/gulp-tsc/index.js:50:20    at finish (/var/www/BJS/Babylon.js/Tools/Gulp/node_modules/gulp-tsc/lib/compiler.js:120:5)    at /var/www/BJS/Babylon.js/Tools/Gulp/node_modules/gulp-tsc/lib/compiler.js:112:9    at DestroyableTransform.<anonymous> (/var/www/BJS/Babylon.js/Tools/Gulp/node_modules/gulp-tsc/lib/compiler.js:217:5)    at DestroyableTransform.emit (events.js:129:20)

Yet I checked the downloaded gulp file, target ES5 seems to be specified  in the typescript-to-js task.

Any idea please ?

or at last a link to some tsc pertinent manual ?

[Vousk-prod.]

Sorry that won't help much, but I have the same typescript errors with latest Eclipse's palantir typescript compiler.

See this post : http://www.html5gamedevs.com/topic/12197-typescript-errors-since-typescript-plugin-update/

[RaananW]

[21:48:33] Compiling TypeScript files using tsc version null

What version of tsc are you using?

 

Those errors are all correct. HTMLElement has no src property. But the call in video structure is returning a HTMLSourceElement, which has one. This is declared in the lib.d.ts file, located somewhere on your system (if you only installed typescript using npm, i believe it is where your npm modules are installed). It seems like your lib.d.ts is simply not updated.

[Vousk-prod.]

[21:48:33] Compiling TypeScript files using tsc version null

 

I also have this exact same strange line when I'm trying to compile with tsc.

I'm in the same situation as jerome, fresh node.js, gulp installed (at first as global, then) as local in BJS/Tools/Gulp folder.

 

Here's the dump when I try gulp typescript-to-js

[22:10:40] Starting ‘typescript-to-js’...[22:10:41] Compiling TypeScript files using tsc version null[22:10:41] [tsc] > La ligne de commande est trop longue.[22:10:41] Failed to compile Typescript: Error: tsc command has exited with code:1events .js :72throw er; // Unhandled ‘error’ eventError in plugin ‘<-[36mgulp-tsc<-[39m'Failed to compile: tsc command has exited with code:1at F:\DEV\GitHub\Babylon .js\Tools\Gulp\node_modules\gulp-tsc\index.js :51 :33at F:\DEV\GitHub\Babylon .js\Tools\Gulp\node_modules\gulp-tsc\lib\compiler.js :360:8at Array.forEach (native)at Function.Compiler._allAborted (F:\DEV\GitHub\Babylon.js\Tools\Gulp\node_modules\gulp-tsc\lib\compiler.js :359:13)at Function .Compiler.abortAll (F:\DEV\GitHub\Babylon .js\Tools\Gulp\node_modules\gulp-tsc\lib\compiler.js :337:14)at F:\DEV\GitHub\Babylon .js\Tools\Gulp\node_modules\gulp-tsc\index.js :50:20at finish (F:\DEV\GitHub\Babylon .js\Tools\Gulp\node_modules\gulp-tsc\lib\compiler.js :120:5)at F:\DEV\GitHub\Babylon .js\Tools\Gulp\node_modules\gulp-tsc\lib\compiler.js :112:9at DestroyableTransform.<anonymous> (F:\DEV\GitHub\Babylon .js\Tools\Gulp\node_modules\gulp-tsc\lib\compiler.js :217:5)at DestroyableTransform.emit (events .js :117:20)

"Compiling TypeScript files using tsc version null", same as jerome, but also :

[22:10:41] [tsc] > La ligne de commande est trop longue.    (that means "command line is too long")

[22:10:41] Failed to compile Typescript: Error: tsc command has exited with code:1

[RaananW]

This is a different error, I assume you are using windows. Try (temporarily) moving the entire babylon directory to your root dir (or to a dir named "a" or something in the roort).

The problem here is windows - it limits the amount of characters in the command line. It references each file using its full path and since your path is (relatively) long - F:\DEV\GitHub\Babylon .js\ , adding it to each file causes this.

There is sadly no workaround, we are doing exactly what I told you in order to compile bjs using a build server.

 

Edit - looks like this will be addressed in npm 3 - https://github.com/npm/npm/issues/3697

 

About the null - run:

tsc -version

What do version do you use?

[Vousk-prod.]

#tsc -version

message TS6029: Version 1.4.1.0

 

Good idea, I will try to move everything to root directory (I hope symbolic link will be enough )

[Vousk-prod.]

It works with a symbolic link ! Thanks.

 

And now, I have the exact same compiling errors as jerome...

The same errors I also have in Eclipse with palantir typescript plugin...

[RaananW]

Gulp tsc only supports typescript version ^1.0.1 . I am working with 1.0.3.0 for it to actually work. I wonder if this is the issue.

I just noticed gulp-typescript is much more updated than tsc (gulp tsc - https://github.com/kotas/gulp-tsc , gulp-typescript is at https://github.com/ivogabe/gulp-typescript). Maybe it would work better.

Try anyhow installing a "downgraded" version of typescript and see if it solves the issue. Maybe install tsc 1.0.3 globally (you can remove it later)

 

Edit:

 

This seems to be an issue with the lib.d.ts for newer versions of typescript.

For example, for createElement, the tag name is SOURCE (written in capital) and not "souce", which is what is being used in bjs.

Another example - ImageData's data attribute is UInt8Array in older versions of typescript, but in the newest it is a number[] (which has no set function, this is correct).

 

Those errors should be addressed to support the newest typescript lib.d.ts . I think the source is an error with the capital but the rest look like genuine errors due to type changes.

[jerome]

Only one word comes to my mind : AAAAAaaaarggggg !

 

I'm trying to do everything clean, updated, with latest versions for each tool (tsc v1.4.1.0)...

 

And I just can't have the whole stuff working

 

 

I think I will start a new thread asking for people in here what  really working environment they use.

 

Imho, this problem is a real brake for new people who wants to enter the great contribution arena.

I'm a quite tenacious guy with some skills in deploying linux softs or switching code languages in my mind and I haven't given up so far (but I'm almost about to do it ) but I guess less tenacious people would have leaved far before.

 

 

Maybe should we start a new documentation page about setting validated working environments on different platforms (I can't write anything about this so far) ?

So people won't waste their time just in trying to have the environment working and then can focus only on BJS code.

[jerome]

BTW, coming from Phaser forum, I know Rich Davey (the conceptor of Phaser) decided early to give up TS to vanilla JS only because of these recurrent compiler change implications.

He prefered dealing with javascript lack of rigor rather than dealing with building tool stability issues.

Every choice or opinion are valuable.

 

I can understand as well the TS choice, because this language brings much structuration and control over the code.

 

Maybe then would be worth to define a fixed (but evolutive) recommended validated platform for contributors ?

 

Ex : now the beta is 2.1.

"For contributing to 2.1, we recommend you to use : typescript x.y, tsc x.y.z, gulp x.y.z as we have validated this cross-platform package.

Here is the doc to set up this very recommended environment : link_to_doc "

 

then change only tools value versions when changing BJS version

[Dad72]

lol, I used the old notpadd++ 

I have no problem as ca. but it is true that it is not visual studio intellisense.

 

but I quite agree, I think for the contribution was the most common Javascript and used and even easier that "taputruc" I find, that I do not like.

[RaananW]

Hi Jerome,

 

yeah, those things can be a bit upsetting, but the benefits of such a tool is huge. 

I wanted to check today if the code can be changed to fit typescript 1.4 . It shouldn't be a problem. Casting would solve this problem. And since casting doesn't influence the generated code, I see no problem doing that, especially since it is already working. But there might be a better solution.

 

I think, anyhow, that you can try using a downgraded version of typescript until this is solved. Would be the simplest solution for you.

 

No need to get angry 

[jerome]

don't worry RaananW

I'm not angry (remember the virtual smiley emoticon in my post background ).

 

I know there are many benefits. Else why having those additional complex layers  ?

The upsetting thing is the great variability of the compiler from a version to another : it compiles, you update it, it doesn't compile any longer ... the same source code.

 

So are you modifying each existing BJS class to add casting ??? huge work.

If it then compiles, I hope the next compiler update won't find another thing to grouse against

 

Which tsc version do you recommend to downgrade to ?