Не работают динамические страницы react router dom

Webpack настраивал вручную, роутинг работает как надо, пока не понадобилось решить вопрос с динамическим роутингом (detail/:id).

Пытаюсь открыть эту страницу "http://localhost:3000/detail/123" и всё крашится,в консоли:

GET http://localhost:3000/detail/main.36c0b803e76b0180bf23.js net::ERR_ABORTED 404 (Not Found) 123:10 Refused to execute script from 'http://localhost:3000/detail/main.36c0b803e76b0180bf23.js' because its MIME type ('text/html') is not executable, and strict MIME type checking is enabled.

    <BrowserRouter>
          <Routes>
            <Route path="/" element={<MainLayout />}>
              <Route index element={<Home />} />
              <Route path="detail/:id" element={<div>detail</div>} />
              <Route path="favorites" element={<Favorites />} />
            </Route>
          </Routes>
    </BrowserRouter>

Скорее всего проблема с настройкой entry или output, но как мне настроить, чтобы работало и для dev сервера и для бандла итогого:

  const paths: BuildPaths = {
    entry: path.resolve(__dirname, "src", "index.tsx"),
    output: path.resolve(__dirname, "./dist"),
    html: path.resolve(__dirname, "public", "index.html"),
  };