'Nextjs getStaticPaths not generating paths in build time with dynamic routes

I am trying to go to /users/0 from /users page.

In /users/[id].js


export async function getStaticProps(context) {
  const { params } = context;
  const { id } = params.id;
  const transformedUsers = await getData();
  const foundUser = transformedUsers.find((user) => user.id === id);

  if (transformedUsers.length === 0) {
    return {
      notFound: true,
    };
  }
  return {
    props: {
      user: foundUser,
    },
  };
}

export async function getStaticPaths() {
  const transformedUsers = await getData();
  const ids = transformedUsers.map((user) => user.id);

  const pathsWithParams = ids.map((id) => ({ params: { id } }));

  return {
    paths: pathsWithParams,
    fallback: false,
  };
}

After I run the commands npm run build

└ ● /users/[id]                            298 B          82.4 kB

I am getting this in the console. But when I start the server with npm start and go to /users/0 i am getting 404 not found.

How to provide paths with getStaticPaths?



Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source