Uncaught SyntaxError: Unexpected token '<' (at worker.ts:1:1)

Hello,

I'm trying to learn how to properly use workerpool in React and I think I have it set up. This is my App.tsx:

import { useState } from 'react';
import workerpool from 'workerpool';
import './App.css';

const pool = workerpool.pool("./worker.ts");

const App = () => {
    const [ runTime, setRunTime ] = useState<number>(5);
    const [ amount, setAmount ] = useState<number>(5);
    const [ messages, setMessages ] = useState<string[]>([]);

    const initiateRun = () => {
        // Start X amount of runners
        for (let i = 1; i <= amount; i++) {
            pool.exec("run", [runTime, i], {
                on: (payload) => {
                    const newMessage = "Got a message from worker " + payload.id + ": " + payload.message;
                    setMessages([ ...messages, newMessage ]);
                }
            })
        }
    }

    return (
        <div className="App">
            Run time (minutes):
            <input type="number" value={runTime} onChange={(e) => setRunTime(parseInt(e.target.value))} />
            <br />
            Number of concurrent runners
            <input type="number" value={amount} onChange={(e) => setAmount(parseInt(e.target.value))} />
            <br />
            <button onClick={initiateRun}>Start</button>
            {messages.map(m => <div>{m}</div>)}
        </div>
    )
};

export default App;

And here is my worker.ts:

import workerpool from 'workerpool';

const makeCall = (): Promise<string> => {
    return new Promise(resolve => {
        setTimeout(async () => {
            // Placeholder for an API call:
            const result: string = "Wow, got a result at time " + (new Date()).toString();

            resolve(result);
        }, 5000);
    });
}

const run = async (runTime: number, workerId: number): Promise<void> => {
    // "runTume" = end in X minutes
    const endTime: number = Date.now() + (runTime * 60 * 1000);

    while (Date.now() < endTime) {
        const callResult: string = await makeCall();

        workerpool.workerEmit({
            id: workerId,
            message: callResult
        });
    }
};

workerpool.worker({
    run: run
});

My file tree looks like this:

test-app
| - node_modules
| - public
| - src
|   | - App.css
|   | - App.tsx
|   | - index.css
|   | - index.tsx
|   | - worker.ts
| - .gitignore
| - package-lock.json
| - package.json
| - README.md
| - tsconfig.json

When I'm clicking the "Start" button, nothing happens except I get this on the Chrome Console, one for every worker:

Uncaught SyntaxError: Unexpected token '<' (at worker.ts:1:1)

I have tried to remove the type declarations on both methods in worker.ts but I still got the same. What am I doing wrong?

josdejong / workerpool

Uncaught SyntaxError: Unexpected token '<' (at worker.ts:1:1) #367