AWS Amplify ! Build failed for nextjs Sanity Project #2403
Description
Facing issue in Nextjs Project, while Build and Deployment, on localhost the both sanity studio and nextjs frontend working properly, here im facing while deployment of nextjs FE project, and the sanity studio is also deployed and working on AWS
this is my sanity.ts file
import { createClient } from '@sanity/client';
export const client = createClient({
projectId: 'projectid',
dataset: 'production',
useCdn: true,
});Home Page
import Link from "next/link"
import { client } from "@/lib/sanity"
import { ArrowRight, Calendar } from "lucide-react"
import { Button } from "@/components/ui/button"
import { Card, CardContent, CardFooter, CardHeader, CardTitle } from "@/components/ui/card"
type Post = {
title: string
slug: { current: string }
content: string
publishedAt: string
excerpt?: string
}
export default async function HomePage() {
let posts: Post[] = []
try {
posts = (await client.fetch('*[_type == "post"]{_id, title, content, slug, publishedAt}')) || []
} catch (error) {
console.error("Error fetching posts:", error)
}
return (
<div className="min-h-screen bg-background">
<header className="border-b py-8">
<div className="container mx-auto px-4">
<div className="flex flex-col items-center justify-center space-y-2">
<h1 className="text-4xl font-bold tracking-tight text-primary">EEN Research</h1>
<p className="text-sm text-muted-foreground">Powered by EEN Group</p>
</div>
</div>
</header>
<main className="container mx-auto px-4 py-12">
<div className="mb-12 text-center">
<h2 className="text-3xl font-semibold tracking-tight">Latest Research</h2>
<div className="mt-2 h-1 w-16 bg-primary mx-auto"></div>
</div>
{posts && posts.length > 0 ? (
<div className="grid grid-cols-1 gap-8 md:grid-cols-2 lg:grid-cols-3">
{posts.map((post) => {
const excerpt =
post.excerpt || (post.content ? post.content.substring(0, 120) + "..." : "No content available")
return (
<Card key={post.slug.current} className="flex flex-col overflow-hidden transition-all hover:shadow-md">
<CardHeader className="pb-2">
<CardTitle className="line-clamp-2 text-xl">{post.title}</CardTitle>
</CardHeader>
<CardContent className="flex-grow">
<div className="flex items-center gap-2 text-sm text-muted-foreground mb-3">
<Calendar className="h-4 w-4" />
<time dateTime={post.publishedAt}>
{new Date(post.publishedAt).toLocaleDateString("en-US", {
year: "numeric",
month: "long",
day: "numeric",
})}
</time>
</div>
<p className="line-clamp-3 text-muted-foreground">{excerpt}</p>
</CardContent>
<CardFooter>
<Button asChild variant="ghost" className="group p-0 font-medium">
<Link href={`/posts/${post.slug.current}`} className="flex items-center gap-1">
Read full article
<ArrowRight className="h-4 w-4 transition-transform group-hover:translate-x-1" />
</Link>
</Button>
</CardFooter>
</Card>
)
})}
</div>
) : (
<div className="text-center py-12">
<h3 className="text-xl font-medium text-muted-foreground">No research articles found</h3>
<p className="mt-2 text-muted-foreground">Check back soon for new publications.</p>
</div>
)}
</main>
<footer className="border-t py-8 bg-muted/30">
<div className="container mx-auto px-4">
<div className="flex flex-col items-center justify-center space-y-4">
<div className="flex items-center space-x-6">
<Link href="https://twitter.com" className="text-muted-foreground hover:text-primary transition-colors">
Twitter
</Link>
<Link href="https://linkedin.com" className="text-muted-foreground hover:text-primary transition-colors">
LinkedIn
</Link>
<Link href="https://github.com" className="text-muted-foreground hover:text-primary transition-colors">
GitHub
</Link>
</div>
<p className="text-sm text-muted-foreground">
© {new Date().getFullYear()} EEN Group. All rights reserved.
</p>
</div>
</div>
</footer>
</div>
)
}Post Page
/* eslint-disable react/no-unescaped-entities */
import { client } from "@/lib/sanity"
import { ArrowLeft, Calendar } from "lucide-react"
import { Button } from "@/components/ui/button"
import Link from "next/link"
type PageProps<T> = {
params: T
}
interface PostPageParams {
slug: string
}
type Post = {
title: string
content: string
publishedAt: string
}
export default async function PostPage({ params }: PageProps<PostPageParams>) {
const slug = params.slug
let post: Post | null = null
try {
post = await client.fetch(`*[_type == "post" && slug.current == $slug][0]`, { slug })
} catch (error) {
console.error("Error fetching post:", error)
}
if (!post) {
return (
<div className="container mx-auto px-4 py-16 text-center">
<h1 className="text-2xl font-bold">Post not found</h1>
<p className="mt-4">The article you're looking for doesn't exist or has been removed.</p>
<Button asChild variant="outline" className="mt-6">
<Link href="/">Return to home</Link>
</Button>
</div>
)
}
return (
<div className="min-h-screen bg-background">
<header className="border-b py-6">
<div className="container mx-auto px-4">
<div className="flex items-center justify-between">
<Link href="/" className="text-xl font-bold tracking-tight text-primary">
EEN Research
</Link>
<p className="text-sm text-muted-foreground">Powered by EEN Group</p>
</div>
</div>
</header>
<main className="container mx-auto px-4 py-12">
<Button asChild variant="ghost" className="mb-8 flex items-center gap-1 pl-0">
<Link href="/">
<ArrowLeft className="h-4 w-4" />
Back to all articles
</Link>
</Button>
<article className="mx-auto max-w-3xl">
<header className="mb-10 text-center">
<h1 className="text-4xl font-bold tracking-tight md:text-5xl">{post.title}</h1>
<div className="mt-6 flex items-center justify-center gap-2 text-muted-foreground">
<Calendar className="h-4 w-4" />
<time dateTime={post.publishedAt}>
{new Date(post.publishedAt).toLocaleDateString("en-US", {
year: "numeric",
month: "long",
day: "numeric",
})}
</time>
</div>
</header>
<div className="prose prose-lg mx-auto dark:prose-invert">{post.content}</div>
</article>
</main>
<footer className="border-t py-8 bg-muted/30">
<div className="container mx-auto px-4">
<div className="flex flex-col items-center justify-center space-y-4">
<div className="flex items-center space-x-6">
<Link href="https://twitter.com" className="text-muted-foreground hover:text-primary transition-colors">
Twitter
</Link>
<Link href="https://linkedin.com" className="text-muted-foreground hover:text-primary transition-colors">
LinkedIn
</Link>
<Link href="https://github.com" className="text-muted-foreground hover:text-primary transition-colors">
GitHub
</Link>
</div>
<p className="text-sm text-muted-foreground">
© {new Date().getFullYear()} EEN Group. All rights reserved.
</p>
</div>
</div>
</footer>
</div>
)
}ERROR
2025-03-22T12:03:27.662Z [INFO]: # Cloning repository: [email protected]:eengroup/Nextjs-EEN-Blog-Sanity-IO.git
2025-03-22T12:03:28.513Z [INFO]:
2025-03-22T12:03:28.513Z [INFO]: Cloning into 'Nextjs-EEN-Blog-Sanity-IO'...
2025-03-22T12:03:28.514Z [INFO]: # Switching to commit: 40ab7ecc6a8c0e9de1172e50dea6c08b0a3cf238
2025-03-22T12:03:28.527Z [INFO]: Note: switching to '40ab7ecc6a8c0e9de1172e50dea6c08b0a3cf238'.
You are in 'detached HEAD' state. You can look around, make experimental
changes and commit them, and you can discard any commits you make in this
state without impacting any branches by switching back to a branch.
If you want to create a new branch to retain commits you create, you may
do so (now or later) by using -c with the switch command. Example:
git switch -c <new-branch-name>
Or undo this operation with:
git switch -
Turn off this advice by setting config variable advice.detachedHead to false
HEAD is now at 40ab7ec Merge pull request #6 from eengroup/QA
2025-03-22T12:03:28.637Z [INFO]: Successfully cleaned up Git credentials
2025-03-22T12:03:28.637Z [INFO]: # Checking for Git submodules at: /codebuild/output/src3081110157/src/Nextjs-EEN-Blog-Sanity-IO/.gitmodules
2025-03-22T12:03:28.645Z [INFO]: # Retrieving environment cache...
2025-03-22T12:03:28.684Z [WARNING]: ! Unable to write cache: {"code":"ERR_BAD_REQUEST","message":"Request failed with status code 404"})}
2025-03-22T12:03:28.684Z [INFO]: ---- Setting Up SSM Secrets ----
2025-03-22T12:03:28.684Z [INFO]: SSM params {"Path":"/amplify/d2yuzzv08qivf8/main/","WithDecryption":true}
2025-03-22T12:03:28.738Z [WARNING]: !Failed to set up process.env.secrets
2025-03-22T12:03:29.675Z [INFO]: # No package override configuration found.
2025-03-22T12:03:29.678Z [INFO]: # Retrieving cache...
2025-03-22T12:03:33.969Z [INFO]: # Extracting cache...
2025-03-22T12:03:34.635Z [INFO]: # Extraction completed
2025-03-22T12:03:34.658Z [INFO]: # Retrieved cache
2025-03-22T12:03:39.671Z [INFO]: ## Starting Backend Build
## Checking for associated backend environment...
## No backend environment association found, continuing...
## Completed Backend Build
2025-03-22T12:03:39.676Z [INFO]: {"backendDuration": 0}
## Starting Frontend Build
# Starting phase: preBuild
# Executing command: npm ci --cache .npm --prefer-offline
2025-03-22T12:03:57.250Z [WARNING]: npm
2025-03-22T12:03:57.255Z [WARNING]: WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE package: '[email protected]',
npm WARN EBADENGINE required: { node: '20 || >=22' },
npm WARN EBADENGINE current: { node: 'v18.18.2', npm: '9.8.1' }
npm WARN EBADENGINE }
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE package: '[email protected]',
npm WARN EBADENGINE required: { node: '20 || >=22' },
npm WARN EBADENGINE current: { node: 'v18.18.2', npm: '9.8.1' }
npm WARN EBADENGINE }
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE package: '[email protected]',
npm WARN EBADENGINE required: { node: '20 || >=22' },
npm WARN EBADENGINE current: { node: 'v18.18.2', npm: '9.8.1' }
npm WARN EBADENGINE }
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE package: '[email protected]',
npm WARN EBADENGINE required: { node: '20 || >=22' },
npm WARN EBADENGINE current: { node: 'v18.18.2', npm: '9.8.1' }
npm WARN EBADENGINE }
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE package: '[email protected]',
npm WARN EBADENGINE required: { node: '20 || >=22' },
npm WARN EBADENGINE current: { node: 'v18.18.2', npm: '9.8.1' }
npm WARN EBADENGINE }
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE package: '[email protected]',
npm WARN EBADENGINE required: { node: '20 || >=22' },
npm WARN EBADENGINE current: { node: 'v18.18.2', npm: '9.8.1' }
npm WARN EBADENGINE }
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE package: '[email protected]',
npm WARN EBADENGINE required: { node: '20 || >=22' },
npm WARN EBADENGINE current: { node: 'v18.18.2', npm: '9.8.1' }
npm WARN EBADENGINE }
2025-03-22T12:03:57.255Z [WARNING]: npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE package: '[email protected]',
npm WARN EBADENGINE required: { node: '20 || >=22' },
npm WARN EBADENGINE current: { node: 'v18.18.2', npm: '9.8.1' }
npm WARN EBADENGINE }
2025-03-22T12:03:57.255Z [WARNING]: npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE package: '[email protected]',
npm WARN EBADENGINE required: { node: '20 || >=22' },
npm WARN EBADENGINE current: { node: 'v18.18.2', npm: '9.8.1' }
npm WARN EBADENGINE }
2025-03-22T12:03:57.256Z [WARNING]: npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE package: '[email protected]',
npm WARN EBADENGINE required: { node: '20 || >=22' },
npm WARN EBADENGINE current: { node: 'v18.18.2', npm: '9.8.1' }
npm WARN EBADENGINE }
2025-03-22T12:03:57.256Z [WARNING]: npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE
2025-03-22T12:03:57.256Z [WARNING]: package: '[email protected]',
npm WARN EBADENGINE required: { node: '20 || >=22' },
npm WARN EBADENGINE current: { node: 'v18.18.2', npm: '9.8.1' }
npm WARN EBADENGINE }
2025-03-22T12:03:57.256Z [WARNING]: npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE package: '[email protected]',
npm WARN EBADENGINE required: { node: '20 || >=22' },
npm WARN EBADENGINE current: { node: 'v18.18.2', npm: '9.8.1' }
npm WARN EBADENGINE }
2025-03-22T12:03:57.256Z [WARNING]: npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE package: '@sanity/[email protected]',
npm WARN EBADENGINE required: { node: '>=20.11.0' },
npm WARN
2025-03-22T12:03:57.256Z [WARNING]: EBADENGINE current: { node: 'v18.18.2', npm: '9.8.1' }
npm WARN EBADENGINE }
2025-03-22T12:04:45.391Z [INFO]: added 1211 packages, and audited 1427 packages in 54s
2025-03-22T12:04:45.395Z [INFO]: 261 packages are looking for funding
run `npm fund` for details
2025-03-22T12:04:45.455Z [INFO]: 10 moderate severity vulnerabilities
To address issues that do not require attention, run:
npm audit fix
To address all issues (including breaking changes), run:
npm audit fix --force
Run `npm audit` for details.
2025-03-22T12:04:45.498Z [INFO]: # Completed phase: preBuild
# Starting phase: build
# Executing command: npm run build
2025-03-22T12:04:45.822Z [INFO]: > [email protected] build
> next build
2025-03-22T12:04:46.753Z [INFO]: ▲ Next.js 15.2.3
2025-03-22T12:04:46.753Z [INFO]:
2025-03-22T12:04:46.781Z [INFO]: Creating an optimized production build ...
2025-03-22T12:05:01.041Z [INFO]: ✓ Compiled successfully
2025-03-22T12:05:01.055Z [INFO]: Linting and checking validity of types ...
2025-03-22T12:05:04.928Z [WARNING]: Failed to compile.
2025-03-22T12:05:04.932Z [WARNING]: src/app/posts/[slug]/page.tsx
Type error: Type 'PageProps<PostPageParams>' does not satisfy the constraint 'PageProps'.
Types of property 'params' are incompatible.
Type 'PostPageParams' is missing the following properties from type 'Promise<any>': then, catch, finally, [Symbol.toStringTag]
2025-03-22T12:05:04.951Z [WARNING]: Next.js build worker exited with code: 1 and signal: null
2025-03-22T12:05:05.022Z [ERROR]: !!! Build failed
2025-03-22T12:05:05.022Z [INFO]: Please read more about Amplify Hosting's support for SSR frameworks to find if your build failure is related to an unsupported feature: https://docs.aws.amazon.com/amplify/latest/userguide/amplify-ssr-framework-support.html. You may also find this troubleshooting guide useful: https://docs.aws.amazon.com/amplify/latest/userguide/troubleshooting-ssr-deployment.html
2025-03-22T12:05:05.022Z [ERROR]: !!! Error: Command failed with exit code 1
2025-03-22T12:05:05.022Z [INFO]: # Starting environment caching...
2025-03-22T12:05:05.022Z [INFO]: # Environment caching completed
Package.json
{
"name": "nextjs-een-blog-sanity-io",
"version": "0.1.0",
"private": true,
"scripts": {
"dev": "next dev --turbopack",
"build": "next build",
"start": "next start",
"lint": "next lint"
},
"dependencies": {
"@radix-ui/react-slot": "^1.1.2",
"@sanity/client": "^6.28.3",
"class-variance-authority": "^0.7.1",
"clsx": "^2.1.1",
"date-fns": "^4.1.0",
"lucide-react": "^0.483.0",
"next": "15.2.3",
"next-sanity": "^9.9.5",
"react": "^19.0.0",
"react-dom": "^19.0.0",
"tailwind-merge": "^3.0.2",
"tw-animate-css": "^1.2.4"
},
"devDependencies": {
"@eslint/eslintrc": "^3",
"@tailwindcss/postcss": "^4",
"@types/node": "^20",
"@types/react": "^19",
"@types/react-dom": "^19",
"eslint": "^9",
"eslint-config-next": "15.2.3",
"tailwindcss": "^4",
"typescript": "^5"
}
}