3

I'm using esbuild to create React app, its working good, but, when I tried to enable react-router on the app, it can be builder and works, but I'm not able to move between routes, the initial config:

(async () => {
const builder = await build({
    bundle: true,
    define: {"process.env.NODE_ENV": JSON.stringify(process.env.NODE_ENV || 'dev')},
    entryPoints: ["app/index.tsx"],
    incremental: true,
    minify: process.env.NODE_ENV === 'prod',
    
    outfile: './app/public/main.js',
    loader: {
        '.svg': 'dataurl',
        '.png': 'dataurl'
    },
    
});

chokidar.watch("app/src/**/*.{ts,tsx}", {
    interval: 0
}).on("all", () => {
    builder.rebuild()
});

liveServer.start({
    open: true,
    port: process.env.PORT || 8080,
    root: './app/public'
}) })();

And my routes are declare:

<Routes>
    <Route path={'/'} element={<Login />} />
    <Route path={'register'} element={<Register />} />
</Routes>

but the server gives me: Cannot GET /register

Ismael Alexander Malca Castro
  • 31
  • 4

1 Answers1

-1

create new folder 'components' => create new file navigation

import React from 'react'
import { Link } from 'react-router-dom'
const Navigation = () => {
    return (
        <>
            <nav className='flex justify-between items-center h-[50px] px-5 shadow-md bg-gray-500 text-white'>
                <h3>Git search</h3>

                <span>
                    <Link to='/' className='mr-2'>Home</Link>
                    <Link to='/favourites'>Favourites</Link>
                </span>
            </nav>
        </>
    )
}
export default Navigation
user499055
  • 1
  • Welcome to SO! Please don't post code-only answers but add a little textual explanation about how and why your approach works. You may also have a look at our ["How to write a good answer"](https://stackoverflow.com/help/how-to-answer) entry. – ahuemmer Jul 20 '22 at 08:43
  • This doesn't work for getting react routes working specifically with esBuild – Alex Jan 19 '23 at 21:24