404 Page Not Found Looks like you've followed a broken link or entered a URL that doesn't exist on this site

PLEASE help us help you by writing a good post!

Netlify site name: https://63d443893cc04000086c583c--incandescent-mermaid-f9601b.netlify.app/
No Build issue but posing logs:

10:35:14 PM: build-image version: 1ca34a93198b041e44214013884c57d146a23fed (focal)
10:35:14 PM: build-image tag: v4.16.4
10:35:14 PM: buildbot version: 5d70ebdb976733297fb4c90b41002389a248e2df
10:35:14 PM: Fetching cached dependencies
10:35:14 PM: Starting to download cache of 1.0GB
10:35:18 PM: Finished downloading cache in 3.884s
10:35:18 PM: Starting to extract cache
10:35:23 PM: Finished extracting cache in 4.646s
10:35:23 PM: Finished fetching cache in 8.642s
10:35:23 PM: Starting to prepare the repo for build
10:35:23 PM: Preparing Git Reference refs/heads/main
10:35:24 PM: Parsing package.json dependencies
10:35:25 PM: Different publish path detected, going to use the one specified in the Netlify configuration file: β€˜frontend/genesis-area/.next’ versus β€˜.next’ in the Netlify UI
10:35:26 PM: Starting build script
10:35:26 PM: Installing dependencies
10:35:26 PM: Python version set to 2.7
10:35:26 PM: Started restoring cached Node.js version
10:35:26 PM: Finished restoring cached Node.js version
10:35:27 PM: v16.19.0 is already installed.
10:35:27 PM: Now using node v16.19.0 (npm v8.19.3)
10:35:27 PM: Enabling Node.js Corepack
10:35:27 PM: Started restoring cached build plugins
10:35:27 PM: Finished restoring cached build plugins
10:35:27 PM: Attempting Ruby version 2.7.2, read from environment
10:35:28 PM: Using Ruby version 2.7.2
10:35:28 PM: Using PHP version 8.0
10:35:28 PM: Started restoring cached corepack dependencies
10:35:28 PM: mv: cannot move β€˜/opt/build/cache/.node/corepack’ to β€˜/opt/buildhome/.node/corepack’: No such file or directory
10:35:28 PM: Finished restoring cached corepack dependencies
10:35:28 PM: Started restoring cached yarn cache
10:35:30 PM: Finished restoring cached yarn cache
10:35:31 PM: No yarn workspaces detected
10:35:31 PM: Started restoring cached node modules
10:35:31 PM: Finished restoring cached node modules
10:35:31 PM: Installing npm packages using Yarn version 1.22.19
10:35:31 PM: yarn install v1.22.19
10:35:31 PM: [1/5] Validating package.json…
10:35:31 PM: [2/5] Resolving packages…
10:35:31 PM: [3/5] Fetching packages…

10:35:32 PM: warning abitype@0.1.8: The engine "pnpm" appears to be invalid.
10:35:32 PM: [4/5] Linking dependencies...
10:35:32 PM: warning "wagmi > @tanstack/query-sync-storage-persister > @tanstack/query-persist-client-core@4.22.0" has unmet peer dependency "@tanstack/query-core@4.22.0".

10:35:33 PM: [5/5] Building fresh packages…
10:35:33 PM: Done in 2.40s.
10:35:33 PM: npm packages installed using Yarn
10:35:33 PM: Started restoring cached go cache
10:35:33 PM: Finished restoring cached go cache
10:35:33 PM: go version go1.19.5 linux/amd64
10:35:34 PM: Detected 1 framework(s)
10:35:34 PM: β€œnext” at version β€œ13.1.2”
10:35:34 PM: Installing missing commands
10:35:34 PM: Verify run directory
10:35:34 PM: Section completed: initializing
10:35:35 PM: ​
10:35:35 PM: Netlify Build
10:35:35 PM: ────────────────────────────────────────────────────────────────
10:35:35 PM: ​
10:35:35 PM: ❯ Version
10:35:35 PM: @netlify/build 29.5.1
10:35:35 PM: ​
10:35:35 PM: ❯ Flags
10:35:35 PM: baseRelDir: true
10:35:35 PM: buildId: 63d44390f7d93c0008bde408
10:35:35 PM: deployId: 63d44390f7d93c0008bde40a
10:35:35 PM: ​
10:35:35 PM: ❯ Current directory
10:35:35 PM: /opt/build/repo/frontend/genesis-area
10:35:35 PM: ​
10:35:35 PM: ❯ Config file
10:35:35 PM: No config file was defined: using default values.
10:35:35 PM: ​
10:35:35 PM: ❯ Context
10:35:35 PM: production
10:35:35 PM: ​
10:35:35 PM: 1. Build command from Netlify app
10:35:35 PM: ────────────────────────────────────────────────────────────────
10:35:35 PM: ​
10:35:35 PM: $ yarn build
10:35:35 PM: yarn run v1.22.19
10:35:35 PM: $ next build
10:35:36 PM: warn - You have enabled experimental feature (appDir) in next.config.js.
10:35:36 PM: warn - Experimental features are not covered by semver, and may cause unexpected or broken application behavior. Use at your own risk.
10:35:36 PM: info - Thank you for testing appDir please leave your feedback at https://nextjs.link/app-feedback
10:35:36 PM: warn - No build cache found. Please configure build caching for faster rebuilds. Read more: no-cache | Next.js
10:35:36 PM: info - Creating an optimized production build…
10:35:47 PM: warn - Compiled with warnings
10:35:47 PM: ./node_modules/cross-fetch/node_modules/node-fetch/lib/index.js
10:35:47 PM: Module not found: Can’t resolve β€˜encoding’ in β€˜/opt/build/repo/frontend/genesis-area/node_modules/cross-fetch/node_modules/node-fetch/lib’
10:35:47 PM: Import trace for requested module:
10:35:47 PM: ./node_modules/cross-fetch/node_modules/node-fetch/lib/index.js
10:35:47 PM: ./node_modules/cross-fetch/dist/node-ponyfill.js

10:35:47 PM: ./node_modules/@walletconnect/jsonrpc-http-connection/dist/cjs/http.js
10:35:47 PM: ./node_modules/@walletconnect/jsonrpc-http-connection/dist/cjs/index.js
10:35:47 PM: ./node_modules/@walletconnect/ethereum-provider/dist/cjs/index.js
10:35:47 PM: ./node_modules/@wagmi/core/dist/connectors/walletConnect.js

10:35:47 PM: ./node_modules/wagmi/dist/connectors/walletConnect.js
10:35:47 PM: ./provider/web3/web3.tsx
10:35:47 PM: ./provider/web3/index.ts
10:35:47 PM: ./provider/index.ts
10:35:47 PM: ./app/layout.tsx
10:35:47 PM: info - Linting and checking validity of types…
10:35:50 PM: ./components/mintFlow/Confirm.tsx
10:35:50 PM: 16:9 Warning: Using <img> could result in slower LCP and higher bandwidth. Use <Image /> from next/image instead to utilize Image Optimization. See: https://nextjs.org/docs/messages/no-img-element @next/next/no-img-element
10:35:50 PM: ./components/mintFlow/MintFlow.tsx
10:35:50 PM: 135:6 Warning: React Hook useEffect has missing dependencies: β€˜isErrorMint’ and β€˜isLoadingMint’. Either include them or remove the dependency array. react-hooks/exhaustive-deps
10:35:50 PM: info - Need to disable some ESLint rules? Learn more here: Basic Features: ESLint | Next.js
10:35:51 PM: info - Collecting page data…
10:35:55 PM: info - Generating static pages (0/3)
10:35:55 PM: [DEPRECATED] getStorage, serialize and deserialize options are deprecated. Please use storage option instead.
10:35:55 PM: [DEPRECATED] default export is deprecated, instead import { createStore } …
10:35:55 PM: info - Generating static pages (3/3)
10:35:56 PM: info - Finalizing page optimization…
10:35:56 PM: Route (app) Size First Load JS
10:35:56 PM: ─ β—‹ / 0 B 0 B
10:35:56 PM: + First Load JS shared by all 231 kB
10:35:56 PM: β”œ chunks/17-cc83e60b909609e9.js 64.7 kB
10:35:56 PM: β”œ chunks/976-de93b2c62a7421ab.js 164 kB
10:35:56 PM: β”œ chunks/main-app-44df173e09cc39d5.js 211 B
10:35:56 PM: β”” chunks/webpack-70d85ab54f7592b8.js 1.93 kB
10:35:56 PM: Route (pages) Size First Load JS
10:35:56 PM: ─ β—‹ /404 181 B 81.6 kB
10:35:56 PM: + First Load JS shared by all 81.4 kB
10:35:56 PM: β”œ chunks/main-9721bb39c576ddac.js 79.3 kB
10:35:56 PM: β”œ chunks/pages/_app-28547d7edeccc3c3.js 194 B
10:35:56 PM: β”” chunks/webpack-70d85ab54f7592b8.js 1.93 kB
10:35:56 PM: β—‹ (Static) automatically rendered as static HTML (uses no initial props)
10:35:56 PM: Done in 20.43s.
10:35:56 PM: ​
10:35:56 PM: (build.command completed in 20.6s)
10:35:56 PM: ​
10:35:56 PM: 2. Deploy site
10:35:56 PM: ────────────────────────────────────────────────────────────────
10:35:56 PM: ​
10:35:56 PM: Starting to deploy site from β€˜frontend/genesis-area/.next’
10:35:56 PM: Calculating files to upload
10:35:56 PM: 13 new files to upload
10:35:56 PM: 0 new functions to upload
10:35:57 PM: Section completed: deploying
10:35:57 PM: Site deploy was successfully initiated
10:35:57 PM: ​
10:35:57 PM: (Deploy site completed in 1s)
10:35:57 PM: ​
10:35:57 PM: Netlify Build Complete
10:35:57 PM: Starting post processing
10:35:57 PM: ────────────────────────────────────────────────────────────────
10:35:57 PM: ​
10:35:57 PM: (Netlify Build completed in 21.6s)
10:35:57 PM: Caching artifacts
10:35:57 PM: Post processing - HTML
10:35:57 PM: Started saving node modules
10:35:57 PM: Finished saving node modules
10:35:57 PM: Started saving build plugins
10:35:57 PM: Finished saving build plugins
10:35:57 PM: Started saving yarn cache
10:35:57 PM: Post processing - header rules
10:35:58 PM: Post processing - redirect rules
10:35:58 PM: Post processing done
10:35:58 PM: Section completed: postprocessing
10:35:58 PM: Site is live :sparkles:
10:35:59 PM: Finished saving yarn cache
10:35:59 PM: Started saving pip cache
10:35:59 PM: Finished saving pip cache
10:35:59 PM: Started saving emacs cask dependencies
10:35:59 PM: Finished saving emacs cask dependencies
10:35:59 PM: Started saving maven dependencies
10:35:59 PM: Finished saving maven dependencies
10:35:59 PM: Started saving boot dependencies
10:35:59 PM: Finished saving boot dependencies
10:35:59 PM: Started saving rust rustup cache
10:35:59 PM: Finished saving rust rustup cache
10:35:59 PM: Started saving go dependencies
10:35:59 PM: Finished saving go dependencies
10:35:59 PM: Build script success
10:35:59 PM: Section completed: building
10:36:02 PM: Uploading Cache of size 1.0GB
10:36:08 PM: Section completed: cleanup
10:36:08 PM: Finished processing build request in 53.49s

Not sure where the issue is:

I have a repo that has the following structure:

https://github.com/organizationAbc/projectAbc/frontend/genesis-area/package.json

I am using Next 13 and have appDir enabled. The build goes through but it’s displaying that 404.

Tried to upload the build folder that Netlify spit out on a fresh app but the result is the same.

Here is what I have in the build

Base directory
frontend/genesis-area

Build command
yarn build

Publish directory
frontend/genesis-area/.next

Build status
Active

What am I missing.

Thanks for help

@devdomsos Is there an index.html file in the folder that is being deployed to Netlify?

If the folder you’ve provided a screenshot of is what is being uploaded, it looks like the root of the repository, not the result of the build.

Hi @devdomsos, kindly read the Netlify blog post in the link below to see how to properly deploy Next.js 13 on Netlify.

Let me know the outcome.
Thanks.

Hey @nathanmartin,

thanks for reply. Exactly was my thought. I have gone through the troubleshooting thread from netlify forum and that was the first question - why in the zip file that I downloaded from Netlify after building there is no index.html.

Another Next.js project on Netlify, that I have access to, has the index as well as all the assets like images etc.

The build logs are saying this:

10:35:56 PM: ​
10:35:56 PM: Starting to deploy site from β€˜frontend/genesis-area/.next’
10:35:56 PM: Calculating files to upload
10:35:56 PM: 13 new files to upload
10:35:56 PM: 0 new functions to upload
10:35:57 PM: Section completed: deploying
10:35:57 PM: Site deploy was successfully initiated
10:35:57 PM: ​
10:35:57 PM: (Deploy site completed in 1s)
10:35:57 PM: ​
10:35:57 PM: Netlify Build Complete
10:35:57 PM: Starting post processing
10:35:57 PM:

When I build the side locally it is also the same directory frontend/genesis-area/.next

Not sure why Netlify is not building index.html.

Maybe these are incorrect?

Base directory
frontend/genesis-area

Build command
yarn build

Publish directory
frontend/genesis-area/.next

:thinking:

Hey @clarnx,

thanks for replying. I have installed this library in my project - please see ss

Also Netlify says

incandescent-mermaid-f9601b is a Next.js site!
Netlify auto-detected Next.js and will use the Next.js Runtime to build and deploy your site.

I installed the Next Runtime on the netlify account.

Solved this stupid riddle. Really stupid, couldn’t find the reason why but when using yarn build it would not properly output the build folder.

So I only changed this:

Base directory
frontend/genesis-area

Build command
yarn build

Publish directory
frontend/genesis-area/.next

Build status
Active
Base directory
frontend/genesis-area

Build command
npm run build ---> only this built the site correctly

Publish directory
frontend/genesis-area/.next

Build status
Active

Can someone explain to me why yarn build was passing the publishing on Netlify (no errors while building) but was outputing the root of my repo instead of creating a build with index.html which then leads to 404?

1 Like

I can see in the yarn version of the build logs, the Next.js Runtime was not installed/working. Thus the 404s.

1 Like