Why is webpack not including my function in my ts file

I have made a fresh blazor serverside app. And I have created a tsconfig.json and JS/src folder in my project folder. In Terminal, I have used npm init -y in my JS folder. Node modules can now be installed. I installed webpack and created a webpack.config.js file in my JS folder. Then I create a simple ts file with an alert function. After configuring my tsconfig.json in my project root, I added <script src="js/bundle.js"></script> to my _Layout.cshtml. And then in my index.cshtml page I added a button and some code to call the compiled bundle.js from webpack, located in wwwroot/js/.

I cannot see the function in my bundle.js file. What have I done wrong?

Folder structure:

tsconfig.json:

{
  "compilerOptions": {
    "noImplicitAny": false,
    "noEmitOnError": true,
    "removeComments": false,
    "sourceMap": true,
    "target": "ES2017",
    "moduleResolution": "Node"
  },
  "exclude": [
    "node_modules"
  ],
  "include": [
    "./JS/src/*.ts"
  ]
}

webpack.config.js:

const path = require('path');

module.exports = {
    entry: './src/index.ts',
    module: {
        rules: [
            {
                test: /\.tsx?$/,
                use: 'ts-loader',
                exclude:/node_modules/,
            },
        ],
    },
    resolve: {
        extensions: ['.ts', '.js'],
    },
    output: {
        filename: 'bundle.js',
        path: path.resolve(__dirname, '../wwwroot/js'),
    },
};

index.ts:

function showAlert() {
    alert("this is a test");
}

package.json:

{
  "name": "js",
  "version": "1.0.0",
  "description": "",
  "main": "webpack.config.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "build": "webpack"
  },
  "keywords": [],
  "author": "",
  "license": "ISC",
  "devDependencies": {
    "ts-loader": "^9.2.6",
    "typescript": "^4.5.5",
    "webpack-cli": "^4.9.2"
  }
}

Ok so after some struggling I figured out that I need to expose the function as a library.

In webpack.config.js:

const path = require('path');

module.exports = {
    entry: './src/index.ts',
    module: {
        rules: [
            {
                test: /\.tsx?$/,
                use: 'ts-loader',
                exclude:/node_modules/,
            },
        ],
    },
    resolve: {
        extensions: ['', '.js', '.ts']
    },
    output: {
        filename: 'bundle.js',
        path: path.resolve(__dirname, '../wwwroot/js'),
        libraryTarget: 'umd',
        library: 'EntryPoint'
    },
};

Take note of the library and library target in the output section. I am not entirely sure whether var umd const or let is better for the library target, as I am not sure what UMD is. however it seems to work with either.

Here is my updated index.ts file:

import { Calculator } from "./calculator";

export function showAlert() {
    console.log("Hello world");
    alert("this is a test");
}

export let foo = new Calculator();
let bar = new Calculator();

Notice how foo and showAlert have export in front. This is required. Bar is not accessible.