Issue Encountered:
Error Type: Duplicate identifier 'pageProps'.
Solution Attempted in _app.tsx
import { SessionProvider } from "next-auth/react"
import "tailwindcss/tailwind.css";
import '../styles/globals.css';
export default function App({Component}: {Component:any} , pageProps: { session: any, ...pageProps: any[]}) {
}) {
return (
// `session` parameters sourced from `getServerSideProps` or `getInitialProps`.
// Prevents flickering/session loading upon initial load.
<SessionProvider session={session}>
<Component {...pageProps} />
</SessionProvider>
)
}
Adjustments Made in global.d.ts
// global.d.ts
import { MongoClient } from "mongodb"
import { PrismaClient } from '@prisma/client';
// various global declarations included.
declare global {
var mongoClientPromise: Promise<MongoClient>;
var prisma: PrismaClient;
}
Updates Implemented in types.d.ts
import type { DefaultUser } from 'next-auth';
declare module 'next-auth' {
interface Session {
user?: DefaultUser & {
id: string;
};
}
}
Maintenance Carried out in next-env.d.ts
/// <reference types="next" />
/// <reference types="next/image-types/global" />
// Important note: Avoid editing this file directly
// Check https://nextjs.org/docs/basic-features/typescript for more details.
In Search of a Resolution
Reviewing My pkg.json
{
"name": "basically-email",
"version": "0.1.0",
"private": true,
"scripts": {
"dev": "next dev",
"build": "next build",
"start": "next start",
"lint": "next lint"
},
"dependencies": {
"@emotion/react": "^11.7.1",
"@emotion/styled": "^11.6.0",
"@mui/material": "^5.4.2",
"@next-auth/mongodb-adapter": "^1.0.1",
"@next-auth/prisma-adapter": "^1.0.1",
"@prisma/client": "^3.9.2",
"@types/next-auth": "^3.15.0",
"axios": "^0.26.0",
"mongodb": "^4.4.0",
"next": "12.1.0",
"next-auth": "^4.2.1",
"react": "^17.0.2",
"react-dom": "17.0.2",
"typings": "^2.1.1"
},
"devDependencies": {
"@types/node": "^17.0.18",
"@types/react": "17.0.39",
"autoprefixer": "^10.4.2",
"eslint": "8.9.0",
"eslint-config-next": "12.1.0",
"postcss": "^8.4.6",
"prisma": "^3.9.2",
"tailwindcss": "^3.0.23",
"typescript": "^4.5.5"
}
}
Puzzled by the Persisting Issue
Vercel Deployment and Error Encounter
If you have insights on rectifying this error, kindly share your suggestions. Thank you! The error emerged during the app deployment on Vercel, resulting in build failure. Upon running the project on localhost:3000, it functions smoothly without any errors. I am puzzled by why this error appeared specifically during Vercel deployment.