Nextjs Build Error: Export encountered errors on following paths /users/[userid]

Question

i have created a nextjs app, i'm getting data from an express server deployed on netlify. i have created two pages, the first to display a list of users (i've got the users with getServerSideProps() function) and the second page is when you click on a user, you'll be redirected to the user profile (i've got the user's data with getStaticProps() and getStaticPaths() functions).

On localhost everything works fine.

But when i've tried to deploy the app on Netlify, i got this error while building it:

> Build error occurred 11:24:20 PM: Error: Export encountered errors on following paths /users/[userid]

The users list file:

import styles from "../../styles/Home.module.css";
import Link from "next/link";

export default function Users({ users }) {
  return (
    <div className={styles.container}>
      {users.map((user) => (
        <Link href={`/users/${user._id}`} key={user._id}>
          {user.firstname}
        </Link>
      ))}
    </div>
  );
}

export async function getServerSideProps() {
  const res = await fetch("https://***************/api/users");
  const users = await res.json();

  return { props: { users} };
}

The profile file:

import React from "react";

export default function singleUser({ user }) {
  return (
    <div>
      <h1>Hello {user.firstname}!</h1>
    </div>
  );
}

export async function getStaticPaths() {
  const res = await fetch("https://***************************/api/users");
  const users = await res.json();

  const paths = users.map((user) => ({
    params: { userid: user._id },
  }));

  return { paths, fallback: true };
}

// This also gets called at build time
export async function getStaticProps({ params }) {
  const res = await fetch(`https://**********************/api/users/${params.userid}`);
  const user = await res.json();

  return { props: { user: user || {} }, revalidate: 3600 };
}