Doesn't work with Next.js

[joshhills]

Hi sorry this is more of a question than a discrete issue - do you have any knowledge of whether this should work with Next.js? I've got it to a state where it is replacing the route in the URL (flashes by quickly) however the app itself just loads the index. I know Next handles routing a little differently to React, wondering if it's a lost cause. Can provide more info if you're interested in helping, otherwise feel free to delete this :-)

[rafgraph]

You should be able to use next export, which generates static html, with GitHub Pages without the need for spa-github-pages.

[joshhills]

The issue I'm having is that the route is dynamic - i.e. it goes and gets an arbitrary resource from an external API that I can't predict the ID of and ergo can't provide Next with a full list of. I'm going to try moving the route replacement script you added in this repo to the Index.html to the inside of the App itself and see if that works

[joshhills]

Update: this works

export default function MyApp({ Component, pageProps }) {

  const router = useRouter()

  if (Object.keys(router.query).length >= 1) {
    const firstQuery = Object.keys(router.query)[0]
    if (firstQuery[0] === '/') {
      const decoded = firstQuery.slice(1).split('&').map((s) => s.replace(/~and~/g,'&')).join('?')

      router.push(router.pathname + decoded)
    }
  }

  return (
    // APP CODE
  )
}

[discordianfish]

I've got it working somewhat with next.js but the problem is I'm getting a redirect loop for pages that really don't exist. Frankly, I don't understand how this is not a problem for vanilla react apps...