Next.js project deployment was failed by typescript types

Question

I'm trying to deploy my project by vercel. i wrote it with next.js and typescript.

i'm using Next-auth with credentials provider for authentication. by default this package for authentication has an object for session something like this:

{ name?: string; email?: string; image?: string; }. here's the point: i added an id property to this object as string in the types file of this package, i just want to use the user id in the session.

everythis works fine and i can use the id for the backend and typescript can recognize the id property but in deployment process i got an error.

so here some of types that i added the id property to the types file:

export interface DefaultUser {
  name?: string | null
  email?: string | null
  image?: string | null
  id?: string | null      // Here
}

export interface DefaultJWT extends Record<string, unknown> {
  name?: string | null
  email?: string | null
  picture?: string | null
  id?: string | null      // Here
  sub?: string
}

export interface DefaultSession extends Record<string, unknown> {
  user?: {
    name?: string | null
    email?: string | null
    image?: string | null
    id?: string | null      // Here
  }
  expires?: string
}

this is my auth file (/api/auth/[...nextauth].js):

export default NextAuth({
  session: {
    jwt: true
  },

  providers: [
    Providers.Credentials({
      async authorize(credentials: Record<"email" | "password", string>, req) {
        try {
          return await authOperation(credentials); // this returns { id: "****", email: "****" }
        } catch (error) {
          throw error;
        }
      }
    })
  ],

  // these code are for add id property

  callbacks: {
    jwt: async (token, user, account, profile, isNewUser) => {
      if (user) {
        token.id = user.id;
      }
      return Promise.resolve(token);
    },

    session: async (session, user) => {
      session.user.id = user.id as string;
      return Promise.resolve(session);
    }
  }
});

this is the error i got in vercel:

20:22:45.371    Cloning github.com/mohammaDJ23/invoice (Branch: master, Commit: 575d08a)
20:22:45.621    Cloning completed: 249.901ms
20:22:45.659    Analyzing source code...
20:22:46.872    Installing build runtime...
20:22:49.742    Build runtime installed: 2.869s
20:22:52.630    Looking up build cache...
20:22:52.992    Build Cache not found
20:22:54.235    Installing dependencies...
20:23:04.676    npm WARN optional SKIPPING OPTIONAL DEPENDENCY: [email protected] (node_modules/fsevents):
20:23:04.676    npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for [email protected]: wanted {"os":"darwin","arch":"any"} (current: {"os":"linux","arch":"x64"})
20:23:04.680    added 416 packages from 427 contributors in 9.896s
20:23:04.860    56 packages are looking for funding
20:23:04.860      run `npm fund` for details
20:23:04.908    Detected Next.js version: 10.2.2
20:23:04.911    Running "npm run build"
20:23:05.185    > [email protected] build /vercel/path0
20:23:05.185    > next build
20:23:06.040    info  - Using webpack 5. Reason: no custom webpack configuration in next.config.js https://nextjs.org/docs/messages/webpack5
20:23:06.198    Attention: Next.js now collects completely anonymous telemetry regarding usage.
20:23:06.198    This information is used to shape Next.js' roadmap and prioritize features.
20:23:06.198    You can learn more, including how to opt-out if you'd not like to participate in this anonymous program, by visiting the following URL:
20:23:06.199    https://nextjs.org/telemetry
20:23:06.248    info  - Checking validity of types...
20:23:13.456    Failed to compile.
20:23:13.456    ./pages/api/auth/[...nextauth].ts:32:20
20:23:13.456    Type error: Property 'id' does not exist on type '{ name?: string; email?: string; image?: string; }'.
20:23:13.457      30 | 
20:23:13.457      31 |     session: async (session, user) => {
20:23:13.457    > 32 |       session.user.id = user.id as string;
20:23:13.457         |                    ^
20:23:13.457      33 |       return Promise.resolve(session);
20:23:13.457      34 |     }
20:23:13.457      35 |   }
20:23:13.475    npm ERR! code ELIFECYCLE
20:23:13.475    npm ERR! errno 1
20:23:13.479    npm ERR! [email protected] build: `next build`
20:23:13.479    npm ERR! Exit status 1
20:23:13.480    npm ERR! 
20:23:13.480    npm ERR! Failed at the [email protected] build script.
20:23:13.480    npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
20:23:13.487    npm ERR! A complete log of this run can be found in:
20:23:13.487    npm ERR!     /vercel/.npm/_logs/2021-05-27T15_53_13_480Z-debug.log
20:23:13.501    Error: Command "npm run build" exited with 1

Rahul Sharma · Accepted Answer · 2021-05-28 05:06:23Z

1

you can use like below check doc

session.userId = user.id

OR You can try using any type for the session. It'll solve your issue.

session: async (session:any, user) => {
    session.user.id = user.id as string;
    return Promise.resolve(session);
}

edited May 28, 2021 at 5:06

answered May 28, 2021 at 4:44

Rahul Sharma

10.1k1 gold badge20 silver badges41 bronze badges

Sign up to request clarification or add additional context in comments.

7 Comments

mohammad nowresideh Over a year ago

stackoverflow.com/users/8879527/rahul-sharma Thanks Rahul Sharma. i tried what did you say, looks like works but i have another error, when i want to extract the id of user in some request by getSesssion(). in development process it works fine and i did console.log(session.user.id) and i saw the id but in deploy process can't recognize the id. this is the new error:

12:48:13.614  	Type error: Property 'id' does not exist on type '{ name?: string; email?: string; image?: string; }'. const user = await User.findById({  _id: mongoose.Types.ObjectId(userSession.user.id) });

mohammad nowresideh Over a year ago

stackoverflow.com/users/8879527/rahul-sharma Should i use any type for all of sessions?

Rahul Sharma Over a year ago

You should avoid it but if you don't find any solution, Better to go ahead with any.

mohammad nowresideh Over a year ago

stackoverflow.com/users/8879527/rahul-sharma Yeah you'r right i did't find any solution to ignore this error, i used any type and it solved my problem, anyway thanks a lot for your help.

mohammad nowresideh Over a year ago

stackoverflow.com/users/8879527/rahul-sharma Do you know why this error occurred?

|

Collectives™ on Stack Overflow

Next.js project deployment was failed by typescript types

1 Answer 1

7 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

7 Comments

Your Answer

Sign up or log in

Post as a guest

Related