How to generate Typescript definitions for ES5 version of the Spine 4 runtime?

[AndrewJS]

The Spine runtime for Pixi supports Spine version 4 now but the project transitioned to ES6:

https://github.com/pixijs/spine

It outputs an ES5/UMD build for the Javascript but without Typescript definitions. The 3.8 version had these definitions.

"Vanilla JS, UMD build

All pixiJS v6 plugins has special umd build suited for vanilla.
Navigate pixi-spine npm package, take dist/pixi-spine.umd.js file.
Unfortunately, there are no typescript definitions for vanilla build on both pixi v6 and pixi-spine"

I can get the class definitions from the ES6 output but I don't know the namespaces used in the UMD version. How are the namespaces assigned to each class when generating the ES5 output?

What would be the easiest way to produce Typescript definitions for the UMD version? I guess the same applies to Pixi 6 but I don't need to upgrade to this until later.

[ivan.popelyshev]

you dont use import/exports, you use good old ts namespaces, right?

 I honestly hate es6 imports., but i had to sacrifice something to satisfy all those react-webpack-coders

as for namespaces, well, its "PIXI.spine". Take definitions for runtime-4.0 , add definitions from loader-4.0 and base, treat them like they are in "PIXI.spine". Simple ctrl+c ctrl+v with a few replacements should do, and its not like spine API is changing every time, it'll do it long run just fine.

As for PIXI, look in v5 definitions - there's a trick something like "define module PIXI { .. something about "pixi.js" with typeof }" -  you can try concat all module definitions of pixi 6 and then use that hack.

If you manage to do it - please share the details, maybe we can just make a script.

I was waiting when someone who needs that will try to do it!

 

 

[AndrewJS]

Yeah I still use the Typescript namespaces, haven't switched to import/export yet. I have a big framework that would take a while to port to ES6.

I can see some advantages of import/export for things like multiple definitions but it also ties the imports to the file paths so moving/renaming things can get messy with a lot of files.

For the namespaces, I was looking at PIXI.spine but it doesn't seem to have all the definitions. When I log that in the console from the UMD file, it produces:

PIXI.spine;
AttachmentType: {0: "Region", 1: "BoundingBox", 2: "Mesh", 3: "LinkedMesh", 4: "Path", 5: "Point", 6: "Clipping", Region: 0, BoundingBox: 1, Mesh: 2, LinkedMesh: 3, Path: 4, …}
BinaryInput: class BinaryInput
Color: class Color
DebugUtils: class DebugUtils
IntSet: class IntSet
Interpolation: class Interpolation
MathUtils: class MathUtils
Pool: class Pool
Pow: class Pow
PowOut: class PowOut
Spine: class Spine$3
SpineBase: class SpineBase
SpineMesh: class SpineMesh
SpineParser: class SpineParser
SpineSprite: class SpineSprite
StringSet: class StringSet
TextureAtlas: class TextureAtlas
TextureAtlasPage: class TextureAtlasPage
TextureAtlasRegion: class TextureAtlasRegion
TextureFilter: {9728: "Nearest", 9729: "Linear", 9984: "MipMapNearestNearest", 9985: "MipMapLinearNearest", 9986: "MipMapNearestLinear", 9987: "MipMapLinearLinear", Nearest: 9728, Linear: 9729, MipMap: 9987, MipMapNearestNearest: 9984, MipMapLinearNearest: 9985, …}
TextureRegion: class TextureRegion
TextureWrap: {10497: "Repeat", 33071: "ClampToEdge", 33648: "MirroredRepeat", MirroredRepeat: 33648, ClampToEdge: 33071, Repeat: 10497}
TimeKeeper: class TimeKeeper
Utils: class Utils
Vector2: class Vector2
WindowedMean: class WindowedMean
filterFromString: ƒ filterFromString(text)
settings: {yDown: true, FAIL_ON_NON_EXISTING_SKIN: false, GLOBAL_AUTO_UPDATE: true, GLOBAL_DELAY_LIMIT: 0}
wrapFromString: ƒ wrapFromString(text)

I can't find classes like AnimationStateData or anything from the runtime folders. These used to be in PIXI.spine.core but these files are now in the runtime-4 folder and I don't know which namespace they are placed in the UMD output.

Once I can get it working I'll post the result. I have done something similar for ThreeJS and it worked out fine, just had to rename some things manually.

[ivan.popelyshev]

yes, because you use `pixi-spine` package, and it doesnt expose internals because there are 3 different AnimationStateData !!!! for 3.7, 3.8 and 4.0

it exposes only interfaces.

Try `@pixi-spine/all-4.0` , it re-exports whole 4.0 runtime