Как экспортировать класс TypeScript таким образом, чтобы не нарушать доступ к объекту, используя простой старый ванильный JavaScript

Простите мое незнание в этом вопросе, я застрял и надеюсь получить какое-то руководство.

Возьмите этот пример класса Greeter, найденный на TypeScript страница детской площадки:

class Greeter {
    greeting: string;
    constructor(message: string) {
        this.greeting = message;
    }
    greet() {
        return "Hello, " + this.greeting;
    }
}

Мне было поручено создать и управлять одним компонентом, который можно использовать как в простой среде HTML + JavaScript, так и в приложении Angular. Я управляю / пишу этот код на TypeScript и использую TypeScript для компиляции вывода как JavaScript.

Возвращаясь к приведенному выше примеру, если бы я хотел сделать этот класс доступным (как импорт) в Angular, мне нужно было бы экспортировать класс?

export class Greeter {
    ...
}

Когда я это делаю, страница выдает ошибки:

Uncaught ReferenceError: define is not defined

Скомпилированный JavaScript выглядит так:

define(["require", "exports"], function (require, exports) {
    "use strict";
    Object.defineProperty(exports, "__esModule", { value: true });
    var Greeter = /** @class */ (function () {
        function Greeter(message) {
            this.greeting = message;
        }
        Greeter.prototype.greet = function () {
            return "Hello, " + this.greeting;
        };
        return Greeter;
    }());
    exports.Greeter = Greeter;
    var greeter = new Greeter("world");
});

Поскольку класс Greeter теперь привязан к этому блоку определения, я, очевидно, не могу создать экземпляр нового класса как такового:

let greeter = new Greeter("world"); // < -- Won't work.

Выдает ошибку:

Uncaught ReferenceError: Greeter is not defined

1. Как я могу экспортировать этот класс таким образом, чтобы не нарушать доступ к объекту, скажем, в стиле ванильного JavaScript?
2. Возможно ли то, что я пытаюсь сделать?
3. Это разумная цель, или я здесь совершенно ошибаюсь?