CODEWITHSUNDEEP
reactjsbuildnext.jsmaterial-uiserve
Saranya
Saranya

Reputation: 69

Getting 404 page while serving the build of the NextJs App while its running fine in the development mode

I am pretty new to React/Next JS. So here's my issue. I have purchased a theme and made changes to the config and branding part. Now when I run the app using "yarn dev" and "yarn start", it is working fine. "yarn build" also creates an optimized production build. I wanted to deploy the app locally in my PC and i was trying to learn things through youtube videos. so in one of the videos i found this command ("prod": "next build && serve build") to include in package.json. my package.json file has the following scripts.

"scripts": { "dev": "next dev", "build": "next build", "start": "next start", "export": "next export", "lint": "eslint --fix "src//*.{js,jsx}"", "format": "prettier --write "src//*.{js,jsx}"", "prod": "next build && serve build" },

so when i try with "yarn prod", it is first creating an optimized build and then i get the following output in the vscode terminal

enter image description here

however if i try to open "http://localhost:3000" in my browser. i get 404 error. but not with "yarn dev" or "yarn start". no error while building the app too.

Upvotes: 0

Views: 3319

Answers (1)

Amiya Panigrahi
Amiya Panigrahi

Reputation: 189

Add the "cleanUrls": true to "firebase.json" file as below

 {
  "hosting": {
    "public": "out",
    "ignore": [
      "firebase.json",
      "**/.*",
      "**/node_modules/**"
    ],
    "cleanUrls": true,
    "rewrites": [
      {
        "source": "**",
        "destination": "/index.html"
      }
    ]
  }
}

Upvotes: 0

Related Questions