Next JS npm start app load 404 page not found error for physical pages

Question

My project works well with run dev command but when I try to npm start I got 404 page not found error for other pages (pages/...) except Index.js.

I tried several ways which I found from forms(gthub issues, and blogs), but nothing worked.

Any Idea? Actually why there should be difference between run dev and start? I think we should see whats wrong in our app during the dev process

the scripts from package.json

"scripts": {
  "dev": "next",
  "start": "next start",
  "build": "next build"

},

and next.config.js

const withCSS = require("@zeit/next-css");
module.exports = withCSS({
  cssModules: true,
  cssLoaderOptions: {
    importLoaders: 1,
    localIdentName: "[local]___[hash:base64:5]"
  }});

As you see I didn't change anything after installing nextJS.

Answer 1

I found out that if the filenames have uppercase letters on Windows, you get a 404 error.

I changed all filenames to lowercase characters and the 404 errors went away.

Answer 2

First, you need to understand what kind of app do you want to build. Is it serverless? or kind of with server and what web server do u want to use (there are so many options).

For serverless app:

All you need to do for production build is next export, this function will generate static files to be served as your website. Read more here...

For app with server:

If you want to run npm run start, you need to do npm run build first.

npm run build compiles and optimizes your build for production mode.

npm run start run your web server to serve your html files.

If you have done those two steps, it means something wrong with your server files, your web server's API didn't listen to the request, therefore it doesn't redirect you to the correct page.