[ts] Modularize spine-canvas, fixup rollup setup

.gitignore

@@ -149,3 +149,5 @@ cmake-build-debug-visual-studio
 spine-cocos2dx/build-v4/
 spine-cocos2dx/example-v4/cocos2d
 spine-cocos2dx/example-v4/cocos2dx.zip
+spine-ts/spine-canvas/dist
+spine-ts/spine-core/dist

spine-ts/package-lock.json

@@ -13,7 +13,13 @@
         "spine-player",
         "spine-threejs",
         "spine-webgl"
-      ]
+      ],
+      "devDependencies": {
+        "npx": "^10.2.2",
+        "rollup": "^2.56.2",
+        "rollup-plugin-dts": "^3.0.2",
+        "typescript": "^4.3.5"
+      }
     },
     "node_modules/@babel/code-frame": {
       "version": "7.14.5",
@@ -53,6 +59,10 @@
         "node": ">=6.9.0"
       }
     },
+    "node_modules/@esotericsoftware/spine-canvas": {
+      "resolved": "spine-canvas",
+      "link": true
+    },
     "node_modules/@esotericsoftware/spine-core": {
       "resolved": "spine-core",
       "link": true
@@ -102,16 +112,6 @@
       "dev": true,
       "optional": true
     },
-    "node_modules/esbuild": {
-      "version": "0.12.21",
-      "resolved": "https://registry.npmjs.org/esbuild/-/esbuild-0.12.21.tgz",
-      "integrity": "sha512-7hyXbU3g94aREufI/5nls7Xcc+RGQeZWZApm6hoBaFvt2BPtpT4TjFMQ9Tb1jU8XyBGz00ShmiyflCogphMHFQ==",
-      "dev": true,
-      "hasInstallScript": true,
-      "bin": {
-        "esbuild": "bin/esbuild"
-      }
-    },
     "node_modules/escape-string-regexp": {
       "version": "1.0.5",
       "resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-1.0.5.tgz",
@@ -5272,17 +5272,21 @@
         "node": ">=4.2.0"
       }
     },
-    "spine-core": {
+    "spine-canvas": {
-      "name": "@esotericsoftware/spine-core",
+      "name": "@esotericsoftware/spine-canvas",
       "version": "4.0.1",
       "license": "LicenseRef-LICENSE",
       "devDependencies": {
-        "esbuild": "^0.12.21",
         "npx": "^10.2.2",
         "rollup": "^2.56.2",
         "rollup-plugin-dts": "^3.0.2",
         "typescript": "^4.3.5"
       }
+    },
+    "spine-core": {
+      "name": "@esotericsoftware/spine-core",
+      "version": "4.0.1",
+      "license": "LicenseRef-LICENSE"
     }
   },
   "dependencies": {
@@ -5315,16 +5319,18 @@
         "js-tokens": "^4.0.0"
       }
     },
-    "@esotericsoftware/spine-core": {
+    "@esotericsoftware/spine-canvas": {
-      "version": "file:spine-core",
+      "version": "file:spine-canvas",
       "requires": {
-        "esbuild": "^0.12.21",
         "npx": "^10.2.2",
         "rollup": "^2.56.2",
         "rollup-plugin-dts": "^3.0.2",
         "typescript": "^4.3.5"
       }
     },
+    "@esotericsoftware/spine-core": {
+      "version": "file:spine-core"
+    },
     "ansi-styles": {
       "version": "3.2.1",
       "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-3.2.1.tgz",
@@ -5364,12 +5370,6 @@
       "dev": true,
       "optional": true
     },
-    "esbuild": {
-      "version": "0.12.21",
-      "resolved": "https://registry.npmjs.org/esbuild/-/esbuild-0.12.21.tgz",
-      "integrity": "sha512-7hyXbU3g94aREufI/5nls7Xcc+RGQeZWZApm6hoBaFvt2BPtpT4TjFMQ9Tb1jU8XyBGz00ShmiyflCogphMHFQ==",
-      "dev": true
-    },
     "escape-string-regexp": {
       "version": "1.0.5",
       "resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-1.0.5.tgz",

spine-ts/package.json

@@ -2,7 +2,9 @@
   "name": "spine-ts",
   "version": "4.0.1",
   "description": "The official Spine Runtimes for the web.",
-  "scripts": {},
+  "scripts": {
+    "build": "npx tsc -b --clean; tsc -b; npx rollup -c rollup.config.js --sourcemap;"
+  },
   "repository": {
     "type": "git",
     "url": "git+https://github.com/esotericsoftware/spine-runtimes.git"
@@ -29,5 +31,11 @@
     "spine-player",
     "spine-threejs",
     "spine-webgl"
-  ]
+  ],
+  "devDependencies": {
+    "npx": "^10.2.2",
+    "rollup": "^2.56.2",
+    "rollup-plugin-dts": "^3.0.2",
+    "typescript": "^4.3.5"
+  }
 }

spine-ts/rollup.config.js

@@ -0,0 +1,34 @@
+import dts from 'rollup-plugin-dts'
+
+export default [
+	{
+		input: 'spine-core/dist/index.js',
+		context: 'this',
+		output: [
+			{
+				file: 'build/spine-core.js',
+				name: 'spine',
+				format: 'umd',
+				exports: 'named',
+			}
+		]
+	},
+	{
+		input: 'spine-core/dist/index.d.ts',
+		output: [{ file: 'build/spine-core.d.ts', format: 'es' }],
+		plugins: [dts()],
+	},
+
+	{
+		input: 'spine-canvas/dist/index.js',
+		context: 'this',
+		output: [
+			{
+				file: 'build/spine-canvas.js',
+				name: 'spine',
+				format: 'umd',
+				exports: 'named',
+			}
+		]
+	}
+]

spine-ts/spine-canvas/package.json

@@ -0,0 +1,32 @@
+{
+  "name": "@esotericsoftware/spine-canvas",
+  "version": "4.0.1",
+  "description": "The official Spine Runtimes for the web.",
+  "main": "dist/index.js",
+  "scripts": {},
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/esotericsoftware/spine-runtimes.git"
+  },
+  "keywords": [
+    "gamedev",
+    "animations",
+    "2d",
+    "spine",
+    "game-dev",
+    "runtimes",
+    "skeletal"
+  ],
+  "author": "Esoteric Software LLC",
+  "license": "LicenseRef-LICENSE",
+  "bugs": {
+    "url": "https://github.com/esotericsoftware/spine-runtimes/issues"
+  },
+  "homepage": "https://github.com/esotericsoftware/spine-runtimes#readme",
+  "devDependencies": {
+    "npx": "^10.2.2",
+    "rollup": "^2.56.2",
+    "rollup-plugin-dts": "^3.0.2",
+    "typescript": "^4.3.5"
+  }
+}

spine-ts/spine-canvas/src/AssetManager.ts

@@ -27,12 +27,11 @@
  * THE SPINE RUNTIMES, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
  *****************************************************************************/
 
-/// <reference path="../../core/src/AssetManager.ts"/>
+import { Downloader, AssetManagerBase } from "../../spine-core/dist/index";
+import { CanvasTexture } from "./CanvasTexture";
 
-module spine.canvas {
+export class AssetManager extends AssetManagerBase {
-	export class AssetManager extends spine.AssetManager {
+	constructor(pathPrefix: string = "", downloader: Downloader = null) {
-		constructor (pathPrefix: string = "", downloader: Downloader = null) {
+		super((image: HTMLImageElement) => { return new CanvasTexture(image); }, pathPrefix, downloader);
-			super((image: HTMLImageElement) => { return new spine.canvas.CanvasTexture(image); }, pathPrefix, downloader);
-		}
 	}
 }

spine-ts/spine-canvas/src/CanvasTexture.ts

@@ -27,16 +27,14 @@
  * THE SPINE RUNTIMES, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
  *****************************************************************************/
 
-/// <reference path="../../core/src/Texture.ts"/>
+import { Texture, TextureFilter, TextureWrap } from "../../spine-core/dist/index";
 
-module spine.canvas {
+export class CanvasTexture extends Texture {
-	export class CanvasTexture extends Texture {
+	constructor(image: HTMLImageElement) {
-		constructor (image: HTMLImageElement) {
 		super(image);
 	}
 
-		setFilters (minFilter: TextureFilter, magFilter: TextureFilter) { }
+	setFilters(minFilter: TextureFilter, magFilter: TextureFilter) { }
-		setWraps (uWrap: TextureWrap, vWrap: TextureWrap) { }
+	setWraps(uWrap: TextureWrap, vWrap: TextureWrap) { }
-		dispose () { }
+	dispose() { }
-	}
 }

spine-ts/spine-canvas/src/SkeletonRenderer.ts

@@ -27,8 +27,10 @@
  * THE SPINE RUNTIMES, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
  *****************************************************************************/
 
-module spine.canvas {
+import { Utils, Color, Skeleton, RegionAttachment, TextureAtlasRegion, BlendMode, MeshAttachment, Slot } from "../../spine-core/dist/index";
-	export class SkeletonRenderer {
+import { CanvasTexture } from "./CanvasTexture";
+
+export class SkeletonRenderer {
 	static QUAD_TRIANGLES = [0, 1, 2, 2, 3, 0];
 	static VERTEX_SIZE = 2 + 2 + 4;
 
@@ -305,5 +307,4 @@ module spine.canvas {
 
 		return vertices;
 	}
-	}
 }

spine-ts/spine-canvas/src/index.ts

@@ -0,0 +1,28 @@
+import { AssetManager } from "./AssetManager";
+import { CanvasTexture } from "./CanvasTexture";
+import { SkeletonRenderer } from "./SkeletonRenderer";
+
+export * from "./AssetManager";
+export * from "./CanvasTexture";
+export * from "./SkeletonRenderer";
+export * from "../../spine-core/dist/index"
+
+// Needed for compatibility with the old way of how
+// spine-canvas worked. We'd set all exported types
+// on the global spine.canvas. However, with rollup
+// we can only specify a single default object global
+// name, which is spine, not spine.canvas. If spine-canvas.js
+// is used in vanilla.js, we added a property spine.canvas
+// and assign the types of spine-canvas to it. This way
+// old code keeps on working.
+declare global {
+	var spine: any;
+}
+
+if (globalThis.spine) {
+	globalThis.spine.canvas = {
+		AssetManager: AssetManager,
+		CanvasTexture: CanvasTexture,
+		SkeletonRenderer: SkeletonRenderer
+	};
+}

spine-ts/spine-canvas/tsconfig.json

@@ -0,0 +1,19 @@
+{
+	"extends": "../tsconfig.base.json",
+	"compilerOptions": {
+		"rootDir": "./src",
+		"outDir": "./dist",
+		"moduleResolution": "node",
+	},
+	"include": [
+		"**/*.ts"
+	],
+	"exclude": [
+		"dist/**/*.d.ts"
+	],
+	"references": [
+		{
+			"path": "../spine-core"
+		}
+	]
+}

spine-ts/spine-core/package.json

@@ -2,10 +2,8 @@
   "name": "@esotericsoftware/spine-core",
   "version": "4.0.1",
   "description": "The official Spine Runtimes for the web.",
-  "main": "build/index.js",
+  "main": "dist/index.js",
-  "scripts": {
+  "scripts": {},
-    "build": "npx tsc -p ./tsconfig.json; npx rollup -c rollup.config.js --sourcemap;"
-  },
   "repository": {
     "type": "git",
     "url": "git+https://github.com/esotericsoftware/spine-runtimes.git"
@@ -24,11 +22,5 @@
   "bugs": {
     "url": "https://github.com/esotericsoftware/spine-runtimes/issues"
   },
-  "homepage": "https://github.com/esotericsoftware/spine-runtimes#readme",
+  "homepage": "https://github.com/esotericsoftware/spine-runtimes#readme"
-  "devDependencies": {
-    "npx": "^10.2.2",
-    "rollup": "^2.56.2",
-    "rollup-plugin-dts": "^3.0.2",
-    "typescript": "^4.3.5"
-  }
 }

spine-ts/spine-core/rollup.config.js

@@ -1,16 +0,0 @@
-import dts from 'rollup-plugin-dts'
-
-export default [
-	{
-		input: 'build/index.js',
-		context: 'this',
-		output: [
-			{
-				file: '../build/spine-core.js',
-				name: 'spine',
-				format: 'umd',
-				exports: 'named',
-			}
-		]
-	}
-]

spine-ts/spine-core/src/AssetManagerBase.ts

@@ -31,7 +31,7 @@ import { Texture } from "./Texture";
 import { TextureAtlas } from "./TextureAtlas";
 import { Disposable, StringMap } from "./Utils";
 
-export class AssetManager implements Disposable {
+export class AssetManagerBase implements Disposable {
 	private pathPrefix: string;
 	private textureLoader: (image: HTMLImageElement | ImageBitmap) => Texture;
 	private downloader: Downloader;

spine-ts/spine-core/src/TextureAtlas.ts

@@ -27,7 +27,7 @@
  * THE SPINE RUNTIMES, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
  *****************************************************************************/
 
-import { AssetManager } from "./AssetManager";
+import { AssetManagerBase } from "./AssetManagerBase";
 import { TextureFilter, TextureWrap, Texture, TextureRegion } from "./Texture";
 import { Disposable, Utils, StringMap } from "./Utils";
 
@@ -185,7 +185,7 @@ export class TextureAtlas implements Disposable {
 		return null;
 	}
 
-	setTextures(assetManager: AssetManager, pathPrefix: string = "") {
+	setTextures(assetManager: AssetManagerBase, pathPrefix: string = "") {
 		for (let page of this.pages)
 			page.setTexture(assetManager.get(pathPrefix + page.name));
 	}

spine-ts/spine-core/src/attachments/index.ts

@@ -0,0 +1,8 @@
+export * from './Attachment';
+export * from './AttachmentLoader';
+export * from './BoundingBoxAttachment';
+export * from './ClippingAttachment';
+export * from './MeshAttachment';
+export * from './PathAttachment';
+export * from './PointAttachment';
+export * from './RegionAttachment';

spine-ts/spine-core/src/index.ts

@@ -1,42 +1,42 @@
-export * from "./Animation";
+export * from './Animation';
-export * from "./AnimationState";
+export * from './AnimationState';
-export * from "./AnimationStateData";
+export * from './AnimationStateData';
-export * from "./AssetManager";
+export * from './AtlasAttachmentLoader';
-export * from "./AtlasAttachmentLoader";
+export * from './Bone';
-export * from "./Bone";
+export * from './BoneData';
-export * from "./BoneData";
+export * from './ConstraintData';
-export * from "./ConstraintData";
+export * from './AssetManagerBase';
-export * from "./Event";
+export * from './Event';
-export * from "./EventData";
+export * from './EventData';
-export * from "./IkConstraint";
+export * from './IkConstraint';
-export * from "./IkConstraintData";
+export * from './IkConstraintData';
-export * from "./PathConstraint";
+export * from './PathConstraint';
-export * from "./PathConstraintData";
+export * from './PathConstraintData';
-export * from "./Skeleton";
+export * from './Skeleton';
-export * from "./SkeletonBinary";
+export * from './SkeletonBinary';
-export * from "./SkeletonBounds";
+export * from './SkeletonBounds';
-export * from "./SkeletonClipping";
+export * from './SkeletonClipping';
-export * from "./SkeletonData";
+export * from './SkeletonData';
-export * from "./SkeletonJson";
+export * from './SkeletonJson';
-export * from "./Skin";
+export * from './Skin';
-export * from "./Slot";
+export * from './Slot';
-export * from "./SlotData";
+export * from './SlotData';
-export * from "./Texture";
+export * from './Texture';
-export * from "./TextureAtlas";
+export * from './TextureAtlas';
-export * from "./TransformConstraint";
+export * from './TransformConstraint';
-export * from "./TransformConstraintData";
+export * from './TransformConstraintData';
-export * from "./Triangulator";
+export * from './Triangulator';
-export * from "./Updatable";
+export * from './Updatable';
-export * from "./Utils";
+export * from './Utils';
-export * from "./VertexEffect";
+export * from './VertexEffect';
-export * from "./polyfills";
+export * from './polyfills';
-export * from "./attachments/Attachment";
+export * from './attachments/Attachment';
-export * from "./attachments/AttachmentLoader";
+export * from './attachments/AttachmentLoader';
-export * from "./attachments/BoundingBoxAttachment";
+export * from './attachments/BoundingBoxAttachment';
-export * from "./attachments/ClippingAttachment";
+export * from './attachments/ClippingAttachment';
-export * from "./attachments/MeshAttachment";
+export * from './attachments/MeshAttachment';
-export * from "./attachments/PathAttachment";
+export * from './attachments/PathAttachment';
-export * from "./attachments/PointAttachment";
+export * from './attachments/PointAttachment';
-export * from "./attachments/RegionAttachment";
+export * from './attachments/RegionAttachment';
-export * from "./vertexeffects/JitterEffect";
+export * from './vertexeffects/JitterEffect';
-export * from "./vertexeffects/SwirlEffect";
+export * from './vertexeffects/SwirlEffect';

spine-ts/spine-core/tsconfig.json

@@ -1,14 +1,14 @@
 {
-	"extends": "../tsconfig.json",
+	"extends": "../tsconfig.base.json",
 	"compilerOptions": {
-		"rootDir": "src",
+		"rootDir": "./src",
-		"outDir": "build",
+		"outDir": "./dist",
-		"module": "es2015",
+	},
-		"target": "es5",
+	"include": [
-		"moduleResolution": "node",
+		"**/*.ts"
-		"lib": [
+	],
-			"dom",
+	"exclude": [
-			"es2015"
+		"dist/**/*.d.ts"
-		]
+	],
-	}
+	"references": []
 }

spine-ts/tsconfig.base.json

@@ -0,0 +1,21 @@
+{
+	"compilerOptions": {
+		"target": "es5",
+		"module": "es2015",
+		"noImplicitAny": true,
+		"preserveConstEnums": true,
+		"sourceMap": true,
+		"esModuleInterop": true,
+		"isolatedModules": true,
+		"lib": [
+			"DOM",
+			"ES2015"
+		],
+		"declaration": true,
+		"declarationMap": true,
+		"composite": true,
+	},
+	"exclude": [
+		"node_modules"
+	]
+}

spine-ts/tsconfig.build.json

@@ -1,4 +0,0 @@
-{
-	"files": [],
-	"references": [{ "path": "spine-core" }]
-}

spine-ts/tsconfig.json

@@ -1,13 +1,14 @@
 {
-	"compilerOptions": {
+	"files": [],
-		"noImplicitAny": true,
+	"references": [
-		"removeComments": true,
+		{
-		"preserveConstEnums": true,
+			"path": "./spine-core"
-		"sourceMap": true,
-		"declaration": true,
-		"declarationMap": true,
-		"composite": true,
-		"esModuleInterop": true,
-		"isolatedModules": true,
 		},
+		{
+			"path": "./spine-canvas"
+		}
+	],
+	"paths": {
+		"@esotericsoftware/spine-core": "./spine-core/src/index.ts"
+	}
 }