0

I have a Next.js 15 application that builds successfully on AWS Amplify but returns a 404 error when accessing the deployed site. The build completes without errors, but the homepage and other routes are not accessible.

Project Structure

frontend/feedal/
├── apps/
│   ├── landing/ # Landing page app
│   └── web/ # Main dashboard app (this one has the issue)
│       ├── app/
│       │   ├── (dashboard)/
│       │   │   ├── forms/
│       │   │   │   └──── page.tsx
│       │   │   ├── account/
│       │   │   ├── new/
│       │   │   └── layout.tsx
│       │   ├── layout.tsx
│       │   └── page.tsx # ← This was missing initially
│       ├── components/
│       ├── public/
│       └── package.json
├── packages/
│   ├── ui/
│   └── eslint-config/
├── package.json
├── turbo.json
└── amplify.yml

Build Configuration

amplify.yml:

version: 1
applications:
  - frontend:
      phases:
        preBuild:
          commands:
            - npm install -g pnpm
            - pnpm install
        build:
          commands:
            - pnpm run build
            - pwd
            - ls -la
      artifacts:
        baseDirectory: .next
        files:
          - "**/*"
      cache:
        paths:
          - node_modules/**/*
    appRoot: frontend/feedal/apps/web

apps/web/next.config.ts:

import { withSentryConfig } from "@sentry/nextjs";
import type { NextConfig } from "next";

const apiHost = process.env.NEXT_PUBLIC_API_HOST;

const nextConfig: NextConfig = {
  // Your existing Next.js configuration
  transpilePackages: ["@workspace/ui"],
  output: undefined,
  images: {
    remotePatterns: [
      new URL(`${apiHost}/**`),
    ],
  },
};

// Make sure adding Sentry options is the last code to run before exporting
export default withSentryConfig(nextConfig, {
  org: "org",
  project: "org-frontend",

  // Only print logs for uploading source maps in CI
  silent: !process.env.CI,

  // Upload a larger set of source maps for prettier stack traces (increases build time)
  widenClientFileUpload: true,

  // Route browser requests to Sentry through a Next.js rewrite to circumvent ad-blockers.
  tunnelRoute: "/monitoring",

  // Automatically tree-shake Sentry logger statements to reduce bundle size
  disableLogger: true,

  // Enables automatic instrumentation of Vercel Cron Monitors.
  automaticVercelMonitors: true,
});

.npmrc

node-linker=hoisted

I output of pwd and ls -la in the amplify.yml file is

# Executing command: pwd
   /codebuild/output/src2944845910/src/feedal-app/frontend/feedal/apps/web
# Executing command: ls -la
total 68
drwxr-xr-x 13 amplify amplify 4096 Aug  7 07:35 .
drwxr-xr-x  4 amplify amplify   32 Aug  7 07:35 ..
-rw-r--r--  1 amplify amplify  939 Aug  7 07:35 .env.sentry-build-plugin
drwxr-xr-x  8 amplify amplify 4096 Aug  7 07:38 .next
-rwxrwxrwx  1 amplify amplify 1495 Aug  7 07:35 amplify.sh
drwxr-xr-x  7 amplify amplify  252 Aug  7 07:35 app
drwxr-xr-x 17 amplify amplify 4096 Aug  7 07:35 components
-rw-r--r--  1 amplify amplify  455 Aug  7 07:35 components.json
drwxr-xr-x  2 amplify amplify  120 Aug  7 07:35 context
-rw-r--r--  1 amplify amplify  139 Aug  7 07:35 eslint.config.js
drwxr-xr-x  2 amplify amplify  290 Aug  7 07:35 hooks
-rw-r--r--  1 amplify amplify 1225 Aug  7 07:35 instrumentation-client.ts
-rw-r--r--  1 amplify amplify  326 Aug  7 07:35 instrumentation.ts
drwxr-xr-x  2 amplify amplify  169 Aug  7 07:35 lib
drwxr-xr-x  2 amplify amplify  287 Aug  7 07:35 models
-rw-r--r--  1 amplify amplify  211 Aug  7 07:35 next-env.d.ts
-rw-r--r--  1 amplify amplify 1934 Aug  7 07:35 next.config.ts
drwxr-xr-x  3 amplify amplify   24 Aug  7 07:35 node_modules
-rw-r--r--  1 amplify amplify 1902 Aug  7 07:35 package.json
-rw-r--r--  1 amplify amplify   55 Aug  7 07:35 postcss.config.mjs
drwxr-xr-x  6 amplify amplify  239 Aug  7 07:35 public
-rw-r--r--  1 amplify amplify  860 Aug  7 07:35 sentry.edge.config.ts
-rw-r--r--  1 amplify amplify  705 Aug  7 07:35 sentry.server.config.ts
drwxr-xr-x  2 amplify amplify 4096 Aug  7 07:35 services
drwxr-xr-x  2 amplify amplify  115 Aug  7 07:35 styles
-rw-r--r--  1 amplify amplify  418 Aug  7 07:35 tsconfig.json

When built locally, the hierarchy of the .next directory in the turbopack project is

enter image description here

What I've Tried

  1. Verified build success: The build completes successfully with all pages generated
  2. Checked file structure: All expected files are present in the build output
  3. Tested locally: The app runs fine locally with pnpm run dev and pnpm run start
  4. Verified routing: All routes work correctly in development
  5. Checked Amplify logs: No errors in build or deployment logs

Build Output

The build shows successful compilation:

✓ Compiled successfully in 47s
✓ Linting and checking validity of types
✓ Collecting page data
✓ Generating static pages (39/39)
✓ Collecting build traces
✓ Finalizing page optimization
Route (app) Size First Load JS
┌ ○ / 359 B 216 kB
├ ○ /forms 8.36 kB 350 kB
├ ○ /account 9.72 kB 283 kB
└ ... (other routes)

Environment Details

  • Next.js: 15.4.5
  • Node.js: 18.x (Amplify default)
  • Package Manager: pnpm
  • Monorepo: Turborepo
  • Deployment: AWS Amplify
  • App Router: Yes (using app/ directory)

Questions

  1. What could cause a 404 error when the build is successful and all files are present?
  2. Is there a specific configuration needed for Next.js 15 on Amplify?
  3. Could the monorepo structure be causing routing issues?
  4. Are there any Amplify-specific settings I should check?

Additional Context

  • The app uses Next.js App Router with route groups (dashboard)
  • It's part of a monorepo with multiple apps
  • The build artifacts include the .next directory and public folder
  • All environment variables are properly configured

0

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.