Hi all, I'm trying to setup the app routes but the...

# react

[willyrs]

Hi all, I'm trying to setup the app routes but they don't work.

The render is:

override fun RBuilder.render() {
    browserRouter {
        div {
            ul {
                li {
                    routeLink("/") { +"Home" }
                }
                li {
                    routeLink("/test") { +"Test" }
                }
            }

            switch {
                route("/") {
                    h1 {
                        +"Home path"
                    }
                }
                route("/test") {
                    h1 {
                        +"Test path"
                    }
                }
            }
        }
    }
}

What happens:
When I start the website, it prints "Home path". The I press "Test" in the menu, the url changes to http://localhost:8080/test but the header still says "Home path". If I then press F5 I have the error "Cannot GET /test".

What could be the problem? It seems the same as the tutorial that I'm looking at

[christophsturm]

you have to move the route(“/test”) before the route(“/”)

[christophsturm]

it uses the first match that it finds and “/” matches both

[willyrs]

thanks! Now when I click on "/test" it works! But I still have the 404 when I press f5

[willyrs]

I've replaced browserRouter with hashRouter and now F5 works, but the url has become http://localhost:8080/#/test

[christophsturm]

you need SPA support in your web server to make /test work

[christophsturm]

basically in a Single page app the web server needs to serve the index page for all urls

[willyrs]

I got it, the url that I saw is only changed locally

[willyrs]

thanks!

[willyrs]

I'm just transitioning from mobile to web 🙂

[christophsturm]

yw!

[Marc Knaup]

If you use the Webpack Dev Server you need to enable arbitrary paths for loading your app:
https://webpack.js.org/configuration/dev-server/#devserverhistoryapifallback