I have a simple TypeScript project with 2 classes: Main.ts and Ball.ts, first is importing the second one. I'm trying to create a setup similar to AS3 project, where you have one entry point class that triggers all other things to happen. I want to compile all js into a single file so I could load it more efficiently. Files I have:
Main.ts
import Ball from "./Ball";
class Main {
a: number = 10;
constructor() {
console.log("Hello from Main!");
let ball:Ball = new Ball();
}
}
let main = new Main();
Ball.ts
export default class Ball{
shape:string = "round";
constructor(){
console.log("Ball has been created");
}
}
TS Configuration I'm using:
{
"compilerOptions": {
"target": "es5",
"module": "amd",
"outFile": "./public/js/bundle.js",
"strict": true
}
}
To use amd modules in js I use SystemJS:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<h1>Hello</h1>
<script type="text/javascript" src="js/system.js"></script>
<script>
SystemJS.config({
baseURL: '/js'
});
SystemJS.import('bundle.js');
</script>
</body>
</html>
Compiled js file looks like this:
define("Ball", ["require", "exports"], function (require, exports) {
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
var Ball = (function () {
function Ball() {
this.shape = "round";
console.log("Ball has been created");
}
return Ball;
}());
exports.default = Ball;
});
define("Main", ["require", "exports", "Ball"], function (require, exports, Ball_1) {
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
var Main = (function () {
function Main() {
this.a = 10;
console.log("Hello from Main!");
var ball = new Ball_1.default();
}
return Main;
}());
var main = new Main();
});
as I can see, compilation process has no issues, though when I'm viewing resulted code in the browser I don't see anything running, no console.log statements are being triggered to the console. bundle.js itself is loading in the network tab with a status of 200 so I assume SystemJS requesting it and loading the contents correctly, but how can I trigger Main module? I also tried to use system type modules but it gave the same result.