6

I need to use fileStystem methods as readdirSync on an API Route in NextJS. It works locally but when deployed on Vercel, the request responds with a 500 status code.

This is Vercel's Funcion Logs:

catch Error: ENOENT: no such file or directory, scandir '/var/task/_posts'
    at Object.readdirSync (fs.js:1043:3)
    at getAllArticles (/var/task/.next/server/chunks/230.js:135:67)
    at __WEBPACK_DEFAULT_EXPORT__ (/var/task/.next/server/pages/api/search.js:37:93)
    at Object.apiResolver (/var/task/node_modules/next/dist/server/api-utils.js:101:15)
    at processTicksAndRejections (internal/process/task_queues.js:95:5)
    at async Server.handleApiRequest (/var/task/node_modules/next/dist/server/next-server.js:770:9)
    at async Object.fn (/var/task/node_modules/next/dist/server/next-server.js:661:37)
    at async Router.execute (/var/task/node_modules/next/dist/server/router.js:205:32)
    at async Server.run (/var/task/node_modules/next/dist/server/next-server.js:841:29)
    at async Server.handleRequest (/var/task/node_modules/next/dist/server/next-server.js:292:20) {
  errno: -2,
  syscall: 'scandir',
  code: 'ENOENT',
  path: '/var/task/_posts'
}

This is the API Route itself (/pages/api/search.ts):

export default (req: NextApiRequest, res: NextApiResponse) => {
  const { query } = req;

  try {
    if (query.q) {
      const posts = getAllArticles(ArticleTypes.POSTS, ['slug', 'href', 'title', 'category'], {
        hints: {
          hint: query.q as string,
          fields: ['title', 'category'],
        },
      }).map((post) => post.data);

      const projects = getAllArticles(ArticleTypes.PROJECTS, ['slug', 'href', 'title', 'category', 'technologies'], {
        hints: {
          hint: query.q as string,
          fields: ['title', 'category', 'technologies'],
        },
      }).map((project) => project.data);

      res.status(200).json({
        ...(posts.length > 0) && { posts },
        ...(projects.length > 0) && { projects },
      });
    } else {
      res.status(422).send('El parámetro "q" es necesario.');
    }
  } catch (e) {
    res.status(500).send('Ha ocurrido un error mientras se intentaba hacer la búsqueda.');
  }
};

And this is the getAllArticles() function used in it:

export const getAllArticles = (
  type: ArticleTypes,
  items?: string[],
  filters?: IFilters,
): IArticle[] => {
  const articlesPath = join(process.cwd(), `_${type}`);

  const articlesNames = fs
    .readdirSync(articlesPath)
    .filter((path) => /\.mdx$/.test(path));

  const mergedItems: string[] = Array.from(new Set([
    ...(items && items.length > 0) ? items : [],
    ...(filters?.hints && filters.hints.fields.length > 0) ? filters.hints.fields : [],
  ]));

  const allArticles = articlesNames
    .map((article) => getArticle(type,
      path.parse(article).name,
      mergedItems.length > 0
        ? mergedItems
        : undefined));

  const filteredArticles = filterArticles(type, allArticles, filters);

  return filteredArticles;
};

So I am currently using fs.readdirSync for reading .mdx files. As I noted before, this runs perfectly well locally but not when deployed on Vercel. Do I nees to configure any kind of config files or anything?

Thank you so much!

JMRBDev
  • 187
  • 12
  • It doesn't look like the `_posts` folder exist when deployed to Vercel. Do you have that locally? – juliomalves Nov 09 '21 at 19:58
  • Yes, it is present both locally and in the repo. Also, it is in every branch in my repo, just in case that would be important. The Vercel Functions Log is complaining about _posts folder because it is the first one that the API Route looks for, but it would also complain about the _projects folder (same structure, purpose and problem as _posts). – JMRBDev Nov 09 '21 at 21:06
  • This GitHub issue might shed some light on the matter: https://github.com/vercel/next.js/issues/8251. – juliomalves Nov 09 '21 at 21:20
  • 1
    I have already checked that issue multiple times and tried all the possible solutions in it, including https://github.com/vercel/next.js/issues/8251#issuecomment-854148718, but I couldn't make it work. Could you tell me what comment on that issue could be a possible solution for my problem? Thanks – JMRBDev Nov 10 '21 at 15:32
  • 1
    As of Next.js v12, you have to explicitly include those files: https://nextjs.org/docs/advanced-features/output-file-tracing I haven't figured out how to actually use it, though. – Phoenix Sep 14 '22 at 03:00
  • This was helpful for me: `const sqlFolder = path.join(path.join(process.cwd(), 'db'), 'queries');` https://vercel.com/guides/loading-static-file-nextjs-api-route – Ryan Nov 22 '22 at 17:28

0 Answers0