How to implement TypeScript Isolation in Blazor Components?

I know how to implement JavaScript isolation in Blazor components.

// Use the module syntax to export the function
export function sayHi(name) {
    alert(`hello ${name}!`);
}

And

private Task<IJSObjectReference> _module;
private Task<IJSObjectReference> Module => _module ??= JSRuntime.InvokeAsync<IJSObjectReference>("import", "./js/demo.js").AsTask();

async Task Submit()
{
    var module = await Module;
    await module.InvokeVoidAsync("sayHi", name);
}

But how do I implement an isolated TypeScript connection in the Blazor components to call the "sayHi" function defined in the TypeScript file?

The problem is that if I export a function from a TypeScript module, like this:

export function sayHi(name) {
    alert(`hello ${name}!`);
}

Then it is compiled to the following javascript, which does not have " export":

"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.sayHi = void 0;
function sayHi(name) {
    alert("hello " + name + "!");
}
exports.sayHi = sayHi;
//# sourceMappingURL=say.js.map

That's why I have this question. How do I implement an isolated TypeScript connection in the Blazor components to call the "sayHi" function defined in the TypeScript file?

Answer: Set module in compilerOptions to ES2015 or ESNext

Set module in compilerOptions to ES2015 or ESNext – Aleksey L.