0

I'm using Next.js as a replacement for Create React App. I'm not doing any server-side rendering or running any server-side code at all. The only thing the server needs to do is serve files to the browser. The workflow I'm used to from CRA is:

  1. Run npm run build on my computer
  2. rsync the generated files to my shared hosting server

This worked great with my Next.js app, at first. But then I added routing - the new App Router with Next.js v13. It works fine in my dev environment. But on my shared host I'm getting 404 errors on all my routes, other than root. I'm guessing I need to add a .htaccess file, but I can't figure out what needs to be in it.

I noticed the generated files look like:

404.html
index.html
index.txt
myroute.html
myroute.txt
_next/

I need browser calls to both /myroute and /myroute/12345 to work, and they do in dev, but the prod server doesn't seem to know what to do with them.

Dan B.
  • 1,451
  • 2
  • 14
  • 23
  • You will have to add more details ... What does "I need browser calls to both /myroute and /myroute/12345 to work" actually mean? Certainly those URLs do not target actual files on the server side, so what should that server do? I wonder what your local server does to respond to those requests, since you did not tell us ... So what should the server do? – arkascha Aug 30 '23 at 06:05
  • @arkascha I'm not trying to do anything weird, I just followed the instructions in the Next.js app router docs and it works in dev and does not work in prod. What more detail do you need? https://nextjs.org/docs/app/building-your-application/routing/dynamic-routes – Dan B. Aug 30 '23 at 11:20
  • @arkascha In other words, what I need the routes to do is what's described in the docs. `/myroute/12345` needs to render the component that's defined in the file `app/myroute/[slug]/page.tsx`, with the prop `{params: { slug: 12345 } }`. – Dan B. Aug 30 '23 at 13:44
  • Sure, I understood all that from the question. What is unclear is the difference between your local setup and your "hosting". You did not at all say what your local setup is. What http server do you use locally? What is it's setup? You see, before a "route" can get processed by whatever logic you have those requests have to reach that logic first. Which won't work by magic. Since you say that it works locally you apparently have a local setup that takes care of that. I wonder what that is. – arkascha Aug 30 '23 at 16:19
  • My local setup is `npm run dev`. – Dan B. Aug 30 '23 at 19:12
  • https://stackoverflow.com/questions/44038456/how-to-setup-apache-server-for-react-route – arkascha Aug 30 '23 at 21:16
  • Thanks, that prevents the 404 errors, but the information from the routes is not loaded into the component props. – Dan B. Aug 31 '23 at 04:16

0 Answers0