[ts] Refactor module resolution, switch to esbuild

.gitignore

@@ -149,5 +149,9 @@ 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/spine-canvas/dist
+spine-ts/spine-webgl/dist
+spine-ts/spine-player/dist
+spine-ts/spine-threejs/dist

spine-ts/README.md

@@ -1,5 +1,7 @@
 # spine-ts
 
+# In VS Code config, set Extensions > TypeScript > Import Module Specifier to non-relative
+
 The spine-ts runtime provides functionality to load and manipulate [Spine](http://esotericsoftware.com) skeletal animation data using TypeScript and JavaScript. spine-ts is split
 up into multiple modules:
 

spine-ts/package-lock.json

@@ -15,8 +15,10 @@
         "spine-webgl"
       ],
       "devDependencies": {
+        "@rollup/plugin-typescript": "^8.2.5",
+        "esbuild": "^0.12.22",
         "npx": "^10.2.2",
-        "rollup": "^2.56.2",
+        "rollup": "^2.56.3",
         "rollup-plugin-dts": "^3.0.2",
         "typescript": "^4.3.5"
       }
@@ -59,13 +61,50 @@
         "node": ">=6.9.0"
       }
     },
-    "node_modules/@esotericsoftware/spine-canvas": {
+    "node_modules/@esotericsoftware/spine-webgl": {
-      "resolved": "spine-canvas",
+      "resolved": "spine-webgl",
       "link": true
     },
-    "node_modules/@esotericsoftware/spine-core": {
+    "node_modules/@rollup/plugin-typescript": {
-      "resolved": "spine-core",
+      "version": "8.2.5",
-      "link": true
+      "resolved": "https://registry.npmjs.org/@rollup/plugin-typescript/-/plugin-typescript-8.2.5.tgz",
+      "integrity": "sha512-QL/LvDol/PAGB2O0S7/+q2HpSUNodpw7z6nGn9BfoVCPOZ0r4EALrojFU29Bkoi2Hr2jgTocTejJ5GGWZfOxbQ==",
+      "dev": true,
+      "dependencies": {
+        "@rollup/pluginutils": "^3.1.0",
+        "resolve": "^1.17.0"
+      },
+      "engines": {
+        "node": ">=8.0.0"
+      },
+      "peerDependencies": {
+        "rollup": "^2.14.0",
+        "tslib": "*",
+        "typescript": ">=3.7.0"
+      }
+    },
+    "node_modules/@rollup/pluginutils": {
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/@rollup/pluginutils/-/pluginutils-3.1.0.tgz",
+      "integrity": "sha512-GksZ6pr6TpIjHm8h9lSQ8pi8BE9VeubNT0OMJ3B5uZJ8pz73NPiqOtCog/x2/QzM1ENChPKxMDhiQuRHsqc+lg==",
+      "dev": true,
+      "dependencies": {
+        "@types/estree": "0.0.39",
+        "estree-walker": "^1.0.1",
+        "picomatch": "^2.2.2"
+      },
+      "engines": {
+        "node": ">= 8.0.0"
+      },
+      "peerDependencies": {
+        "rollup": "^1.20.0||^2.0.0"
+      }
+    },
+    "node_modules/@types/estree": {
+      "version": "0.0.39",
+      "resolved": "https://registry.npmjs.org/@types/estree/-/estree-0.0.39.tgz",
+      "integrity": "sha512-EYNwp3bU+98cpU4lAWYYL7Zz+2gryWH1qbdDTidVd6hkiR6weksdbMadyXKXNPEkQFhXM+hVO9ZygomHXp+AIw==",
+      "dev": true
     },
     "node_modules/ansi-styles": {
       "version": "3.2.1",
@@ -112,6 +151,16 @@
       "dev": true,
       "optional": true
     },
+    "node_modules/esbuild": {
+      "version": "0.12.22",
+      "resolved": "https://registry.npmjs.org/esbuild/-/esbuild-0.12.22.tgz",
+      "integrity": "sha512-yWCr9RoFehpqoe/+MwZXJpYOEIt7KOEvNnjIeMZpMSyQt+KCBASM3y7yViiN5dJRphf1wGdUz1+M4rTtWd/ulA==",
+      "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",
@@ -122,6 +171,12 @@
         "node": ">=0.8.0"
       }
     },
+    "node_modules/estree-walker": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/estree-walker/-/estree-walker-1.0.1.tgz",
+      "integrity": "sha512-1fMXF3YP4pZZVozF8j/ZLfvnR8NSIljt56UhbZ5PeeDmmGHpgpdwQt7ITlGvYaQukCvuBRMLEiKiYC+oeIg4cg==",
+      "dev": true
+    },
     "node_modules/fsevents": {
       "version": "2.3.2",
       "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.2.tgz",
@@ -136,6 +191,24 @@
         "node": "^8.16.0 || ^10.6.0 || >=11.0.0"
       }
     },
+    "node_modules/function-bind": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/function-bind/-/function-bind-1.1.1.tgz",
+      "integrity": "sha512-yIovAzMX49sF8Yl58fSCWJ5svSLuaibPxXQJFLmBObTuCr0Mf1KiPopGM9NiFjiYBCbfaa2Fh6breQ6ANVTI0A==",
+      "dev": true
+    },
+    "node_modules/has": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/has/-/has-1.0.3.tgz",
+      "integrity": "sha512-f2dvO0VU6Oej7RkWJGrehjbzMAjFp5/VKPp5tTpWIV4JHHZK1/BxbFRtf/siA2SWTe09caDmVtYYzWEIbBS4zw==",
+      "dev": true,
+      "dependencies": {
+        "function-bind": "^1.1.1"
+      },
+      "engines": {
+        "node": ">= 0.4.0"
+      }
+    },
     "node_modules/has-flag": {
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-3.0.0.tgz",
@@ -146,6 +219,18 @@
         "node": ">=4"
       }
     },
+    "node_modules/is-core-module": {
+      "version": "2.6.0",
+      "resolved": "https://registry.npmjs.org/is-core-module/-/is-core-module-2.6.0.tgz",
+      "integrity": "sha512-wShG8vs60jKfPWpF2KZRaAtvt3a20OAn7+IJ6hLPECpSABLcKtFKTTI4ZtH5QcBruBHlq+WsdHWyz0BCZW7svQ==",
+      "dev": true,
+      "dependencies": {
+        "has": "^1.0.3"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
     "node_modules/js-tokens": {
       "version": "4.0.0",
       "resolved": "https://registry.npmjs.org/js-tokens/-/js-tokens-4.0.0.tgz",
@@ -5203,10 +5288,41 @@
       "inBundle": true,
       "license": "ISC"
     },
+    "node_modules/path-parse": {
+      "version": "1.0.7",
+      "resolved": "https://registry.npmjs.org/path-parse/-/path-parse-1.0.7.tgz",
+      "integrity": "sha512-LDJzPVEEEPR+y48z93A0Ed0yXb8pAByGWo/k5YYdYgpY2/2EsOsksJrq7lOHxryrVOn1ejG6oAp8ahvOIQD8sw==",
+      "dev": true
+    },
+    "node_modules/picomatch": {
+      "version": "2.3.0",
+      "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-2.3.0.tgz",
+      "integrity": "sha512-lY1Q/PiJGC2zOv/z391WOTD+Z02bCgsFfvxoXXf6h7kv9o+WmsmzYqrAwY63sNgOxE4xEdq0WyUnXfKeBrSvYw==",
+      "dev": true,
+      "engines": {
+        "node": ">=8.6"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/jonschlinkert"
+      }
+    },
+    "node_modules/resolve": {
+      "version": "1.20.0",
+      "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.20.0.tgz",
+      "integrity": "sha512-wENBPt4ySzg4ybFQW2TT1zMQucPK95HSh/nq2CFTZVOGut2+pQvSsgtda4d26YrYcr067wjbmzOG8byDPBX63A==",
+      "dev": true,
+      "dependencies": {
+        "is-core-module": "^2.2.0",
+        "path-parse": "^1.0.6"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
     "node_modules/rollup": {
-      "version": "2.56.2",
+      "version": "2.56.3",
-      "resolved": "https://registry.npmjs.org/rollup/-/rollup-2.56.2.tgz",
+      "resolved": "https://registry.npmjs.org/rollup/-/rollup-2.56.3.tgz",
-      "integrity": "sha512-s8H00ZsRi29M2/lGdm1u8DJpJ9ML8SUOpVVBd33XNeEeL3NVaTiUcSBHzBdF3eAyR0l7VSpsuoVUGrRHq7aPwQ==",
+      "integrity": "sha512-Au92NuznFklgQCUcV96iXlxUbHuB1vQMaH76DHl5M11TotjOHwqk9CwcrT78+Tnv4FN9uTBxq6p4EJoYkpyekg==",
       "dev": true,
       "bin": {
         "rollup": "dist/bin/rollup"
@@ -5259,6 +5375,13 @@
         "node": ">=4"
       }
     },
+    "node_modules/tslib": {
+      "version": "2.3.1",
+      "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.3.1.tgz",
+      "integrity": "sha512-77EbyPPpMz+FRFRuAFlWMtmgUWGe9UOG2Z25NqCwiIjRhOf5iKGuzSe5P2w1laq+FkRy4p+PCuVkJSGkzTEKVw==",
+      "dev": true,
+      "peer": true
+    },
     "node_modules/typescript": {
       "version": "4.3.5",
       "resolved": "https://registry.npmjs.org/typescript/-/typescript-4.3.5.tgz",
@@ -5275,17 +5398,18 @@
     "spine-canvas": {
       "name": "@esotericsoftware/spine-canvas",
       "version": "4.0.1",
-      "license": "LicenseRef-LICENSE",
+      "extraneous": true,
-      "devDependencies": {
+      "license": "LicenseRef-LICENSE"
-        "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",
+      "extraneous": true,
+      "license": "LicenseRef-LICENSE"
+    },
+    "spine-webgl": {
+      "name": "@esotericsoftware/spine-webgl",
+      "version": "4.0.1",
       "license": "LicenseRef-LICENSE"
     }
   },
@@ -5319,17 +5443,35 @@
         "js-tokens": "^4.0.0"
       }
     },
-    "@esotericsoftware/spine-canvas": {
+    "@esotericsoftware/spine-webgl": {
-      "version": "file:spine-canvas",
+      "version": "file:spine-webgl"
+    },
+    "@rollup/plugin-typescript": {
+      "version": "8.2.5",
+      "resolved": "https://registry.npmjs.org/@rollup/plugin-typescript/-/plugin-typescript-8.2.5.tgz",
+      "integrity": "sha512-QL/LvDol/PAGB2O0S7/+q2HpSUNodpw7z6nGn9BfoVCPOZ0r4EALrojFU29Bkoi2Hr2jgTocTejJ5GGWZfOxbQ==",
+      "dev": true,
       "requires": {
-        "npx": "^10.2.2",
+        "@rollup/pluginutils": "^3.1.0",
-        "rollup": "^2.56.2",
+        "resolve": "^1.17.0"
-        "rollup-plugin-dts": "^3.0.2",
-        "typescript": "^4.3.5"
       }
     },
-    "@esotericsoftware/spine-core": {
+    "@rollup/pluginutils": {
-      "version": "file:spine-core"
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/@rollup/pluginutils/-/pluginutils-3.1.0.tgz",
+      "integrity": "sha512-GksZ6pr6TpIjHm8h9lSQ8pi8BE9VeubNT0OMJ3B5uZJ8pz73NPiqOtCog/x2/QzM1ENChPKxMDhiQuRHsqc+lg==",
+      "dev": true,
+      "requires": {
+        "@types/estree": "0.0.39",
+        "estree-walker": "^1.0.1",
+        "picomatch": "^2.2.2"
+      }
+    },
+    "@types/estree": {
+      "version": "0.0.39",
+      "resolved": "https://registry.npmjs.org/@types/estree/-/estree-0.0.39.tgz",
+      "integrity": "sha512-EYNwp3bU+98cpU4lAWYYL7Zz+2gryWH1qbdDTidVd6hkiR6weksdbMadyXKXNPEkQFhXM+hVO9ZygomHXp+AIw==",
+      "dev": true
     },
     "ansi-styles": {
       "version": "3.2.1",
@@ -5370,6 +5512,12 @@
       "dev": true,
       "optional": true
     },
+    "esbuild": {
+      "version": "0.12.22",
+      "resolved": "https://registry.npmjs.org/esbuild/-/esbuild-0.12.22.tgz",
+      "integrity": "sha512-yWCr9RoFehpqoe/+MwZXJpYOEIt7KOEvNnjIeMZpMSyQt+KCBASM3y7yViiN5dJRphf1wGdUz1+M4rTtWd/ulA==",
+      "dev": true
+    },
     "escape-string-regexp": {
       "version": "1.0.5",
       "resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-1.0.5.tgz",
@@ -5377,6 +5525,12 @@
       "dev": true,
       "optional": true
     },
+    "estree-walker": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/estree-walker/-/estree-walker-1.0.1.tgz",
+      "integrity": "sha512-1fMXF3YP4pZZVozF8j/ZLfvnR8NSIljt56UhbZ5PeeDmmGHpgpdwQt7ITlGvYaQukCvuBRMLEiKiYC+oeIg4cg==",
+      "dev": true
+    },
     "fsevents": {
       "version": "2.3.2",
       "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.2.tgz",
@@ -5384,6 +5538,21 @@
       "dev": true,
       "optional": true
     },
+    "function-bind": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/function-bind/-/function-bind-1.1.1.tgz",
+      "integrity": "sha512-yIovAzMX49sF8Yl58fSCWJ5svSLuaibPxXQJFLmBObTuCr0Mf1KiPopGM9NiFjiYBCbfaa2Fh6breQ6ANVTI0A==",
+      "dev": true
+    },
+    "has": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/has/-/has-1.0.3.tgz",
+      "integrity": "sha512-f2dvO0VU6Oej7RkWJGrehjbzMAjFp5/VKPp5tTpWIV4JHHZK1/BxbFRtf/siA2SWTe09caDmVtYYzWEIbBS4zw==",
+      "dev": true,
+      "requires": {
+        "function-bind": "^1.1.1"
+      }
+    },
     "has-flag": {
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-3.0.0.tgz",
@@ -5391,6 +5560,15 @@
       "dev": true,
       "optional": true
     },
+    "is-core-module": {
+      "version": "2.6.0",
+      "resolved": "https://registry.npmjs.org/is-core-module/-/is-core-module-2.6.0.tgz",
+      "integrity": "sha512-wShG8vs60jKfPWpF2KZRaAtvt3a20OAn7+IJ6hLPECpSABLcKtFKTTI4ZtH5QcBruBHlq+WsdHWyz0BCZW7svQ==",
+      "dev": true,
+      "requires": {
+        "has": "^1.0.3"
+      }
+    },
     "js-tokens": {
       "version": "4.0.0",
       "resolved": "https://registry.npmjs.org/js-tokens/-/js-tokens-4.0.0.tgz",
@@ -9345,10 +9523,32 @@
         }
       }
     },
+    "path-parse": {
+      "version": "1.0.7",
+      "resolved": "https://registry.npmjs.org/path-parse/-/path-parse-1.0.7.tgz",
+      "integrity": "sha512-LDJzPVEEEPR+y48z93A0Ed0yXb8pAByGWo/k5YYdYgpY2/2EsOsksJrq7lOHxryrVOn1ejG6oAp8ahvOIQD8sw==",
+      "dev": true
+    },
+    "picomatch": {
+      "version": "2.3.0",
+      "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-2.3.0.tgz",
+      "integrity": "sha512-lY1Q/PiJGC2zOv/z391WOTD+Z02bCgsFfvxoXXf6h7kv9o+WmsmzYqrAwY63sNgOxE4xEdq0WyUnXfKeBrSvYw==",
+      "dev": true
+    },
+    "resolve": {
+      "version": "1.20.0",
+      "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.20.0.tgz",
+      "integrity": "sha512-wENBPt4ySzg4ybFQW2TT1zMQucPK95HSh/nq2CFTZVOGut2+pQvSsgtda4d26YrYcr067wjbmzOG8byDPBX63A==",
+      "dev": true,
+      "requires": {
+        "is-core-module": "^2.2.0",
+        "path-parse": "^1.0.6"
+      }
+    },
     "rollup": {
-      "version": "2.56.2",
+      "version": "2.56.3",
-      "resolved": "https://registry.npmjs.org/rollup/-/rollup-2.56.2.tgz",
+      "resolved": "https://registry.npmjs.org/rollup/-/rollup-2.56.3.tgz",
-      "integrity": "sha512-s8H00ZsRi29M2/lGdm1u8DJpJ9ML8SUOpVVBd33XNeEeL3NVaTiUcSBHzBdF3eAyR0l7VSpsuoVUGrRHq7aPwQ==",
+      "integrity": "sha512-Au92NuznFklgQCUcV96iXlxUbHuB1vQMaH76DHl5M11TotjOHwqk9CwcrT78+Tnv4FN9uTBxq6p4EJoYkpyekg==",
       "dev": true,
       "requires": {
         "fsevents": "~2.3.2"
@@ -9380,6 +9580,13 @@
         "has-flag": "^3.0.0"
       }
     },
+    "tslib": {
+      "version": "2.3.1",
+      "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.3.1.tgz",
+      "integrity": "sha512-77EbyPPpMz+FRFRuAFlWMtmgUWGe9UOG2Z25NqCwiIjRhOf5iKGuzSe5P2w1laq+FkRy4p+PCuVkJSGkzTEKVw==",
+      "dev": true,
+      "peer": true
+    },
     "typescript": {
       "version": "4.3.5",
       "resolved": "https://registry.npmjs.org/typescript/-/typescript-4.3.5.tgz",

spine-ts/package.json

@@ -33,8 +33,10 @@
     "spine-webgl"
   ],
   "devDependencies": {
+    "@rollup/plugin-typescript": "^8.2.5",
+    "esbuild": "^0.12.22",
     "npx": "^10.2.2",
-    "rollup": "^2.56.2",
+    "rollup": "^2.56.3",
     "rollup-plugin-dts": "^3.0.2",
     "typescript": "^4.3.5"
   }

spine-ts/rollup.config.js

@@ -1,34 +0,0 @@
-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/src/AssetManager.ts

@@ -27,7 +27,7 @@
  * THE SPINE RUNTIMES, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
  *****************************************************************************/
 
-import { Downloader, AssetManagerBase } from "../../spine-core/dist/index";
+import { AssetManagerBase, Downloader } from "spine-core";
 import { CanvasTexture } from "./CanvasTexture";
 
 export class AssetManager extends AssetManagerBase {

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

@@ -27,7 +27,7 @@
  * THE SPINE RUNTIMES, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
  *****************************************************************************/
 
-import { Texture, TextureFilter, TextureWrap } from "../../spine-core/dist/index";
+import { Texture, TextureFilter, TextureWrap } from "spine-core";
 
 export class CanvasTexture extends Texture {
 	constructor(image: HTMLImageElement) {

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

@@ -27,7 +27,7 @@
  * THE SPINE RUNTIMES, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
  *****************************************************************************/
 
-import { Utils, Color, Skeleton, RegionAttachment, TextureAtlasRegion, BlendMode, MeshAttachment, Slot } from "../../spine-core/dist/index";
+import { Utils, Color, Skeleton, RegionAttachment, TextureAtlasRegion, BlendMode, MeshAttachment, Slot } from "spine-core";
 import { CanvasTexture } from "./CanvasTexture";
 
 export class SkeletonRenderer {

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

@@ -1,28 +1,31 @@
-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
+export * from "spine-core";
-// spine-canvas worked. We'd set all exported types
+
-// on the global spine.canvas. However, with rollup
+// Before modularization, we would expose spine-core on the global
-// we can only specify a single default object global
+// `spine` object, and spine-canvas on the global `spine.canvas` object.
-// name, which is spine, not spine.canvas. If spine-canvas.js
+// This was used by clients when including spine-canvas via <script src="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
+// Now with modularization and using esbuild for bundling, we need to emulate this old
-// old code keeps on working.
+// behaviour as to not break old clients.
+//
+// We pass `--global-name=spine` to esbuild. This will create an object containing
+// all exports and assign it to the global variable called `spine`.
+//
+// That solves half the issue. We also need to assign the exports object to 
+// `spine.canvas`. esbuild creates a local variable called `scr_exports` pointing
+// to the exports object. We get to it via eval, then assign it to itself, on a new
+// property called `canvas`. The client can then access the APIs through `spine` and
+// `spine.canvas` as before (with the caveat that both spine-core and spine-canvas are
+// now in `spine` and `spine.canvas`).
+//
+// This will break if esbuild renames the variable `src_exports` pointing to
+// the exports object.
 declare global {
 	var spine: any;
 }
 
-if (globalThis.spine) {
+let exports = eval("src_exports");
-	globalThis.spine.canvas = {
+exports.canvas = exports;
-		AssetManager: AssetManager,
-		CanvasTexture: CanvasTexture,
-		SkeletonRenderer: SkeletonRenderer
-	};
-}

spine-ts/spine-canvas/tsconfig.json

@@ -1,9 +1,14 @@
 {
 	"extends": "../tsconfig.base.json",
 	"compilerOptions": {
+		"baseUrl": ".",
 		"rootDir": "./src",
 		"outDir": "./dist",
-		"moduleResolution": "node",
+		"paths": {
+			"spine-core": [
+				"../spine-core/src"
+			]
+		}
 	},
 	"include": [
 		"**/*.ts"

spine-ts/spine-core/tsconfig.json

@@ -1,8 +1,9 @@
 {
 	"extends": "../tsconfig.base.json",
 	"compilerOptions": {
+		"baseUrl": ".",
 		"rootDir": "./src",
-		"outDir": "./dist",
+		"outDir": "./dist"
 	},
 	"include": [
 		"**/*.ts"

spine-ts/spine-webgl/package.json

@@ -0,0 +1,26 @@
+{
+  "name": "@esotericsoftware/spine-webgl",
+  "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"
+}

spine-ts/spine-webgl/src/AssetManager.ts

@@ -27,12 +27,14 @@
  * THE SPINE RUNTIMES, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
  *****************************************************************************/
 
-module spine.webgl {
+import { AssetManagerBase, Downloader } from "spine-core";
-	export class AssetManager extends spine.AssetManager {
+import { ManagedWebGLRenderingContext } from "./WebGL";
+
+
+export class AssetManager extends AssetManagerBase {
 	constructor(context: ManagedWebGLRenderingContext | WebGLRenderingContext, pathPrefix: string = "", downloader: Downloader = null) {
 		super((image: HTMLImageElement | ImageBitmap) => {
 			return new spine.webgl.GLTexture(context, image);
 		}, pathPrefix, downloader);
 	}
 }
-}

spine-ts/spine-webgl/src/Camera.ts

@@ -27,7 +27,9 @@
  * THE SPINE RUNTIMES, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
  *****************************************************************************/
 
-module spine.webgl {
+import { Matrix4 } from "./Matrix4";
+import { Vector3 } from "./Vector3";
+
 export class OrthoCamera {
 	position = new Vector3(0, 0, 0);
 	direction = new Vector3(0, 0, -1);
@@ -85,4 +87,3 @@ module spine.webgl {
 		this.viewportHeight = viewportHeight;
 	}
 }
-}

spine-ts/spine-webgl/src/GLTexture.ts

@@ -27,7 +27,9 @@
  * THE SPINE RUNTIMES, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
  *****************************************************************************/
 
-module spine.webgl {
+import { Texture, Disposable, Restorable, TextureFilter, TextureWrap } from "spine-core";
+import { ManagedWebGLRenderingContext } from "./WebGL";
+
 export class GLTexture extends Texture implements Disposable, Restorable {
 	context: ManagedWebGLRenderingContext;
 	private texture: WebGLTexture = null;
@@ -108,4 +110,3 @@ module spine.webgl {
 		gl.deleteTexture(this.texture);
 	}
 }
-}

spine-ts/spine-webgl/src/Input.ts

@@ -27,7 +27,8 @@
  * THE SPINE RUNTIMES, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
  *****************************************************************************/
 
-module spine.webgl {
+import { Pool } from "spine-core";
+
 export class Input {
 	element: HTMLElement;
 	lastX = 0;
@@ -36,7 +37,7 @@ module spine.webgl {
 	currTouch: Touch = null;
 	private listeners = new Array<InputListener>();
 
-		touchesPool = new Pool<spine.webgl.Touch>(() => {
+	touchesPool = new Pool<Touch>(() => {
 		return new spine.webgl.Touch(0, 0, 0);
 	});
 
@@ -230,4 +231,3 @@ module spine.webgl {
 	moved(x: number, y: number): void;
 	dragged(x: number, y: number): void;
 }
-}

spine-ts/spine-webgl/src/Matrix4.ts

@@ -27,7 +27,8 @@
  * THE SPINE RUNTIMES, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
  *****************************************************************************/
 
-module spine.webgl {
+import { Vector3 } from "./Vector3";
+
 export const M00 = 0;
 export const M01 = 4;
 export const M02 = 8;
@@ -337,4 +338,3 @@ module spine.webgl {
 		if (Matrix4.zAxis === null) Matrix4.zAxis = new Vector3();
 	}
 }
-}

spine-ts/spine-webgl/src/Mesh.ts

@@ -27,7 +27,11 @@
  * THE SPINE RUNTIMES, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
  *****************************************************************************/
 
-module spine.webgl {
+import { Disposable, Restorable } from "spine-core";
+import { Shader } from "./Shader";
+import { ManagedWebGLRenderingContext } from "./WebGL";
+
+
 export class Mesh implements Disposable, Restorable {
 	private context: ManagedWebGLRenderingContext;
 	private vertices: Float32Array;
@@ -205,4 +209,3 @@ module spine.webgl {
 export enum VertexAttributeType {
 	Float
 }
-}

spine-ts/spine-webgl/src/PolygonBatcher.ts

@@ -27,7 +27,12 @@
  * THE SPINE RUNTIMES, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
  *****************************************************************************/
 
-module spine.webgl {
+import { Disposable } from "spine-core";
+import { GLTexture } from "./GLTexture";
+import { Mesh, Position2Attribute, ColorAttribute, TexCoordAttribute, Color2Attribute } from "./Mesh";
+import { Shader } from "./Shader";
+import { ManagedWebGLRenderingContext } from "./WebGL";
+
 export class PolygonBatcher implements Disposable {
 	private context: ManagedWebGLRenderingContext;
 	private drawCalls: number;
@@ -130,4 +135,3 @@ module spine.webgl {
 		this.mesh.dispose();
 	}
 }
-}

spine-ts/spine-webgl/src/SceneRenderer.ts

@@ -27,7 +27,17 @@
  * THE SPINE RUNTIMES, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
  *****************************************************************************/
 
-module spine.webgl {
+import { Color, Disposable, Skeleton, MathUtils, TextureAtlasRegion } from "spine-core";
+import { OrthoCamera } from "./Camera";
+import { GLTexture } from "./GLTexture";
+import { PolygonBatcher } from "./PolygonBatcher";
+import { Shader } from "./Shader";
+import { ShapeRenderer } from "./ShapeRenderer";
+import { SkeletonDebugRenderer } from "./SkeletonDebugRenderer";
+import { SkeletonRenderer } from "./SkeletonRenderer";
+import { ManagedWebGLRenderingContext } from "./WebGL";
+;
+
 const quad = [
 	0, 0, 1, 1, 1, 1, 0, 0,
 	0, 0, 1, 1, 1, 1, 0, 0,
@@ -503,4 +513,3 @@ module spine.webgl {
 	Expand,
 	Fit
 }
-}

spine-ts/spine-webgl/src/Shader.ts

@@ -27,7 +27,9 @@
  * THE SPINE RUNTIMES, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
  *****************************************************************************/
 
-module spine.webgl {
+import { Disposable, Restorable } from "spine-core";
+import { ManagedWebGLRenderingContext } from "./WebGL";
+
 export class Shader implements Disposable, Restorable {
 	public static MVP_MATRIX = "u_projTrans";
 	public static POSITION = "a_position";
@@ -290,4 +292,3 @@ module spine.webgl {
 		return new Shader(context, vs, fs);
 	}
 }
-}

spine-ts/spine-webgl/src/ShapeRenderer.ts

@@ -27,7 +27,11 @@
  * THE SPINE RUNTIMES, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
  *****************************************************************************/
 
-module spine.webgl {
+import { Disposable, Color, Vector2, MathUtils } from "spine-core";
+import { Mesh, Position2Attribute, ColorAttribute } from "./Mesh";
+import { Shader } from "./Shader";
+import { ManagedWebGLRenderingContext } from "./WebGL";
+
 export class ShapeRenderer implements Disposable {
 	private context: ManagedWebGLRenderingContext;
 	private isDrawing = false;
@@ -346,4 +350,3 @@ module spine.webgl {
 	Line = 0x0001,
 	Filled = 0x0004
 }
-}

spine-ts/spine-webgl/src/SkeletonDebugRenderer.ts

@@ -27,7 +27,10 @@
  * THE SPINE RUNTIMES, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
  *****************************************************************************/
 
-module spine.webgl {
+import { Disposable, Color, SkeletonBounds, Utils, Skeleton, RegionAttachment, MeshAttachment, PathAttachment, ClippingAttachment } from "spine-core";
+import { ShapeRenderer } from "./ShapeRenderer";
+import { ManagedWebGLRenderingContext } from "./WebGL";
+
 export class SkeletonDebugRenderer implements Disposable {
 	boneLineColor = new Color(1, 0, 0, 1);
 	boneOriginColor = new Color(0, 1, 0, 1);
@@ -222,4 +225,3 @@ module spine.webgl {
 	dispose() {
 	}
 }
-}

spine-ts/spine-webgl/src/SkeletonRenderer.ts

@@ -27,9 +27,14 @@
  * THE SPINE RUNTIMES, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
  *****************************************************************************/
 
-module spine.webgl {
+import { NumberArrayLike, VertexEffect, Color, SkeletonClipping, Vector2, Utils, Skeleton, BlendMode, RegionAttachment, TextureAtlasRegion, MeshAttachment, ClippingAttachment } from "spine-core";
+import { GLTexture } from "./GLTexture";
+import { PolygonBatcher } from "./PolygonBatcher";
+import { ManagedWebGLRenderingContext, WebGLBlendModeConverter } from "./WebGL";
+
+
 class Renderable {
-		constructor (public vertices: ArrayLike<number>, public numVertices: number, public numFloats: number) { }
+	constructor(public vertices: NumberArrayLike, public numVertices: number, public numFloats: number) { }
 };
 
 export class SkeletonRenderer {
@@ -39,7 +44,7 @@ module spine.webgl {
 	vertexEffect: VertexEffect = null;
 	private tempColor = new Color();
 	private tempColor2 = new Color();
-		private vertices: ArrayLike<number>;
+	private vertices: NumberArrayLike;
 	private vertexSize = 2 + 2 + 4;
 	private twoColorTint = false;
 	private renderable: Renderable = new Renderable(null, 0, 0);
@@ -68,7 +73,7 @@ module spine.webgl {
 		let tempDark = this.temp4;
 
 		let renderable: Renderable = this.renderable;
-			let uvs: ArrayLike<number> = null;
+		let uvs: NumberArrayLike = null;
 		let triangles: Array<number> = null;
 		let drawOrder = skeleton.drawOrder;
 		let attachmentColor: Color = null;
@@ -296,4 +301,3 @@ module spine.webgl {
 		clipper.clipEnd();
 	}
 }
-}

spine-ts/spine-webgl/src/Vector3.ts

@@ -27,7 +27,8 @@
  * THE SPINE RUNTIMES, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
  *****************************************************************************/
 
-module spine.webgl {
+import { Matrix4, M00, M01, M02, M03, M10, M11, M12, M13, M20, M21, M22, M23, M30, M31, M32, M33 } from "./Matrix4";
+
 export class Vector3 {
 	x = 0;
 	y = 0;
@@ -118,4 +119,3 @@ module spine.webgl {
 		return Math.sqrt(a * a + b * b + c * c);
 	}
 }
-}

spine-ts/spine-webgl/src/WebGL.ts

@@ -27,7 +27,8 @@
  * THE SPINE RUNTIMES, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
  *****************************************************************************/
 
-module spine.webgl {
+import { Restorable, BlendMode } from "spine-core";
+
 export class ManagedWebGLRenderingContext {
 	public canvas: HTMLCanvasElement | OffscreenCanvas;
 	public gl: WebGLRenderingContext;
@@ -104,4 +105,3 @@ module spine.webgl {
 		}
 	}
 }
-}

spine-ts/spine-webgl/src/index.ts

@@ -0,0 +1,43 @@
+export * from './AssetManager';
+export * from './Camera';
+export * from './GLTexture';
+export * from './Input';
+export * from './LoadingScreen';
+export * from './Matrix4';
+export * from './Mesh';
+export * from './PolygonBatcher';
+export * from './SceneRenderer';
+export * from './Shader';
+export * from './ShapeRenderer';
+export * from './SkeletonDebugRenderer';
+export * from './SkeletonRenderer';
+export * from './Vector3';
+export * from './WebGL';
+
+export * from "spine-core";
+
+// Before modularization, we would expose spine-core on the global
+// `spine` object, and spine-webgl on the global `spine.webgl` object.
+// This was used by clients when including spine-webgl via <script src="spine-webgl.js">
+// 
+// Now with modularization and using esbuild for bundling, we need to emulate this old
+// behaviour as to not break old clients.
+//
+// We pass `--global-name=spine` to esbuild. This will create an object containing
+// all exports and assign it to the global variable called `spine`.
+//
+// That solves half the issue. We also need to assign the exports object to 
+// `spine.webgl`. esbuild creates a local variable called `scr_exports` pointing
+// to the exports object. We get to it via eval, then assign it to itself, on a new
+// property called `webgl`. The client can then access the APIs through `spine` and
+// `spine.webgl` as before (with the caveat that both spine-core and spine-webgl are
+// now in `spine` and `spine.webgl`).
+//
+// This will break if esbuild renames the variable `src_exports` pointing to
+// the exports object.
+declare global {
+	var spine: any;
+}
+
+let exports = eval("src_exports");
+exports.webgl = exports;

spine-ts/spine-webgl/tsconfig.json

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

spine-ts/tsconfig.base.json

@@ -1,12 +1,10 @@
 {
 	"compilerOptions": {
-		"target": "es5",
 		"module": "es2015",
 		"noImplicitAny": true,
 		"preserveConstEnums": true,
 		"sourceMap": true,
 		"esModuleInterop": true,
-		"isolatedModules": true,
 		"lib": [
 			"DOM",
 			"ES2015"
@@ -14,8 +12,6 @@
 		"declaration": true,
 		"declarationMap": true,
 		"composite": true,
-	},
+		"moduleResolution": "node",
-	"exclude": [
+	}
-		"node_modules"
-	]
 }

spine-ts/tsconfig.json

@@ -7,8 +7,5 @@
 		{
 			"path": "./spine-canvas"
 		}
-	],
+	]
-	"paths": {
-		"@esotericsoftware/spine-core": "./spine-core/src/index.ts"
-	}
 }