Can't find the JS file - Githubissues

I'm not sure what am I doing wrong, but the point is I can't figure.

Here's my directory structure: /utils/devServer.js - contains the esbuildDevServer configuration file /src/app.tsx - my 'app' /public/dist/index.html - html file exactly as per example

When I run the esbuildDevServer everything goes well... when I try to browse my application I get: Uncaught SyntaxError: Unexpected token '<' (at app.js:1:1)

Which points to the HTML file <!DOCTYPE html> as far as I know this error could mean it can't find the .js file.

Here's my esbuildevserver configuration: const {build} = require("esbuild") const esBuildDevServer = require("esbuild-dev-server")

esBuildDevServer.start(
    build({
        entryPoints: ['./src/app.tsx'],
        bundle: true,
        minify: false,
        sourcemap: true,
        incremental: true,
        metafile: true,
        target: ['chrome58', 'safari11'],
        outdir: './public/dist'
    }),
    {
        port: '8080',
        watchDir: './src',
        index: 'public/dist/index.html',
        staticDir: 'public/dist',
        onBeforeRebuild: {},
        onAfterRebuild: {}
    }
)

here is my 'app'

import React from 'react';
import { createRoot } from 'react-dom/client'

const App = () => {
    return (
    <div>
        Hello World!
    </div>
    )
}

const root = createRoot(document.getElementById('root'))

root.render(<App/>)

here is my html file

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8"/>
        <title>Esbuild & React bundle</title>
    </head>
    <body>
        <div id="root"></div>
        HTML
        <script src="app.js"></script>
    </body>

</html>

What can i possibly be doing wrong?

Falldot / esbuild-dev-server

Can't find the JS file #8