[...nextauth] throwing unexpected errors

[daveodipo]

As per the next-auth-example, I've run a script to copy the relevant functionality to my project and managed the requisite dependencies. However, I'm getting errors in the [...nextauth] file that can't seem to go away. Here is a minimal repository for this.

On the line: import NextAuth, { NextAuthOptions } from "next-auth" I'm getting: Module '"next-auth"' has no exported member 'NextAuthOptions'.

And on: export default NextAuth(authOptions), I'm getting: This expression is not callable. Type 'typeof import("c:/path/next-auth")' has no call signatures.

Here's my code:

import NextAuth, { NextAuthOptions } from "next-auth"
import GoogleProvider from "next-auth/providers/google"
import FacebookProvider from "next-auth/providers/facebook"
import GithubProvider from "next-auth/providers/github"
import TwitterProvider from "next-auth/providers/twitter"
import Auth0Provider from "next-auth/providers/auth0"


export const authOptions: NextAuthOptions = {
  providers: [
    Auth0Provider({
      clientId: process.env.AUTH0_ID,
      clientSecret: process.env.AUTH0_SECRET,
      issuer: process.env.AUTH0_ISSUER,
    }),
    FacebookProvider({
      clientId: process.env.FACEBOOK_ID,
      clientSecret: process.env.FACEBOOK_SECRET,
    }),
    GithubProvider({
      clientId: process.env.GITHUB_ID,
      clientSecret: process.env.GITHUB_SECRET,
    }),
    GoogleProvider({
      clientId: process.env.GOOGLE_ID,
      clientSecret: process.env.GOOGLE_SECRET,
    }),
    TwitterProvider({
      clientId: process.env.TWITTER_ID,
      clientSecret: process.env.TWITTER_SECRET,
      version: "2.0",
    }),
  ],
  callbacks: {
    async jwt({ token }) {
      token.userRole = "admin"
      return token
    },
  },
}

export default NextAuth(authOptions)

Insight on how to fix? Thanks!

[HmadAfzal]

---

I had the same exact problem, and it was fixed by ensuring that the Session type properly extends the built-in DefaultSession. Here's how you can fix it:

Before (Incorrect Approach):

import NextAuth from "next-auth";

declare module "next-auth" {
  interface Session {
    user: {
      id: string;  // Custom 'id' property, but missing default user properties
    };
  }
}

In this approach, the Session type only includes the custom id field in the user object, but it does not include the default properties from DefaultSession, such as name, email, and image.

After (Correct Approach):

import NextAuth, { DefaultSession } from "next-auth";

declare module "next-auth" {
  interface Session {
    user: {
      id: string;  // Custom 'id' property
    } & DefaultSession['user'];  // Extending with default user properties from DefaultSession
  }
}

• Merging Types: By using & DefaultSession['user'], you extend the user object with the default properties from NextAuth’s DefaultSession. This means the user object will contain both your custom id field and the default properties (name, email, image, etc.).

• No Properties Lost: This ensures that none of the default user properties are overwritten, and you maintain compatibility with the built-in session structure provided by NextAuth.

Conclusion:

To add custom properties (like id) to the user object in the Session type while keeping all the default properties, you must extend the Session interface by merging it with DefaultSession['user'].

---

This is the correct way to modify the Session type without losing any of the default fields provided by NextAuth.