Setting up NextJS on Vercel for website deployment can encounter a common error known as ENOENT Error, which is caused by the absence of a specific file or

Everything works perfectly on my local machine:

import fs from 'fs'
import path from 'path'

export default function createNewDirectory (tokenSignature: string) { 
    const directoryPath = path.join(process.cwd(), 'notes', tokenSignature);
    fs.mkdirSync(directoryPath, { recursive: true });    
}

As you can see, I have already included the recursive flag.

However, I encountered the following error:

2022-11-15T19:32:34.119Z    145c46ab-416c-4f5c-b881-80b9c623a5ac    ERROR   Error: ENOENT: no such file or directory, mkdir '/var/task/notes/jFlqLkrmIPOEnaiExiUN3ohlmJlH_GN2OD36fiQ9a2A'
    at Object.mkdirSync (node:fs:1349:3)
    at createUserDir (/var/task/.next/server/chunks/133.js:252:45)
    at getServerSideProps (/var/task/.next/server/pages/index.js:93:76)
    at Object.renderToHTML (/var/task/node_modules/next/dist/server/render.js:506:26)
    at processTicksAndRejections (node:internal/process/task_queues:96:5)
    at async doRender (/var/task/node_modules/next/dist/server/base-server.js:701:34)
    at async cacheEntry.responseCache.get.isManualRevalidate.isManualRevalidate (/var/task/node_modules/next/dist/server/base-server.js:806:28)
    at async /var/task/node_modules/next/dist/server/response-cache/index.js:80:36 {
  errno: -2,
  syscall: 'mkdir',
  path: '/var/task/notes/jFlqLkrmIPOEnaiExiUN3ohlmJlH_GN2OD36fiQ9a2A',
  page: '/'
}
RequestId: 145c46ab-416c-4f5c-b881-80b9c623a5ac Error: Runtime exited with error: exit status 1
Runtime.ExitError

This issue is puzzling as the recursive flag should handle it.

For context, I am using Next version 13.0.3 and Vercel with Node 16.x

Answer №1

I encountered a similar problem when attempting to utilize fs methods. One solution is to include output: 'standalone' in your next.config.js

const nextConfig = {
  // ... other config here
  output: 'standalone'
}

export default nextConfig

After researching further, I found a suggestion to add nftTracing: true, but it seems to be deprecated now.

If the previous solutions don't work, you may want to refer to this lengthy GH issue

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

How can nested json be sorted effectively based on two specific fields?

Example Data: [{ 'ID': objID(abc123), 'Department': 'IT', 'Employees': [ { 'ID': 3, 'StartDate': '24-12-2022T08:30', 'active': true }, { ...

Encountered a error 500 while attempting to POST using Postman in Node.js

After successfully setting up the server, I encountered an issue when attempting to create a user using Postman with the details in Application/JSON format. The server responded with: POST /sign-up 500. Initially, I tried specifying utf-8 without succes ...

Display a toast message when a new entry is inserted into my datatable using Tanstack Query and Shadcn

Currently, I am utilizing Tanstack Query to fetch and poll data from an external API. The retrieved data is being displayed in a datatable (shadcn). To enhance user experience, I wish to implement a toast message feature on my page that alerts users when ...

Having trouble with Tailwind CSS v3 after deploying it on Vercel

After incorporating tailwind-css v3 with nextJs, I faced an issue where my CSS was not rendering correctly when the application was deployed on Vercel. Interestingly, the styles worked perfectly fine while creating the app on localhost. Here is a snippet ...

Creating multiple tables in an HTML template using loops, either with or without JavaScript, each table identical to the one previously created

<html> <head> <title>Bootstrap Example</title> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3. ...

What is the best way to import a YAML file into a Vue project?

As a newcomer to Vue and the world of web development, I recently embarked on building a small app. In order to store data with comments, I opted to use YAML instead of JSON. I experimented with two different YAML parsers: https://github.com/nodeca/js-ya ...

Encountering issues with the useState hook and encountering an API error in my latest project built with Next

System Next.js 13 / React SendGrid Issues Encountering problems with useState functionality Received an error message indicating API resolved without sending a response for /api/send, this may result in stalled requests. Aim To ensure proper functiona ...

Having trouble sending Props between components within a specific route as I keep receiving undefined values

Here is the code for the initial component where I am sending props: const DeveloperCard = ({dev}) => { return ( <Link to={{pathname:`/dev/${dev._id}`, devProps:{dev:dev}}}> <Button variant="primary">Learn More</Butt ...

Searching for a file in Mongoose using an array field of IDs

I am working on a system with two models, Trade and Work, that serve as categories and subcategories of labor. I am trying to implement a feature where new additions automatically select a Trade based on the given Work. However, I am facing challenges in f ...

Oops! Looks like there's an issue with too many re-renders happening. React has a limit on the number of renders to avoid getting stuck in an infinite

Having trouble changing the state and using it for some reason, but can't figure out why! const [valid, setValid] = useState(false) let emailsApplied = [] candidatures.map(c => { emailsApplied.push(c.email) }) let emailSession = '' ...

Modify the information on a page by clicking a button on a different page

I'm currently working on the design of a website that consists of two pages. The first page features a button, which when clicked should remove the hidden class from an element on the second page. I have searched extensively for a solution, but so far ...

Breaking down the jQuery datepicker into individual fields for Day, Month, and Year

Currently, I am using the Contact Form 7 plugin on my Wordpress website, which I believe uses the jQuery datepicker for its date fields (please correct me if I'm mistaken). My query is about splitting the user input box into three separate elements ( ...

I'm wondering why myDivId.toggle() is functioning properly but myDivClass.toggle() is not working as expected

Using JQuery's toggle() function, I have been able to hide and show some DIVs successfully. Recently, I discovered relationships between certain DIVs that allowed me to group them into a class. I decided to try toggling the entire class rather than ...

MooTools Request Unsuccessful

I'm encountering a problem with MooTools where every time I try to send a request, it fails. I'm having trouble figuring out the issue because when I attempt to retrieve the header info, the console just displays "Refused to get unsafe header &ap ...

Utilizing the reduce() function to simultaneously assign values to two variables from data input

Looking to simplify the following function using reduce(), as the operations for variables selectedEnrolled and selectedNotEnrolled are quite similar. I attempted to use map(), but since I wasn't returning anything, it led to unintended side effects ...

Click event not functioning in programmatically loaded HTML

I am facing an issue with a JSON file that contains the page content I am trying to load. The link within it appears as follows: <a data-ng-click='foo()'>Bar</a> When I load this page content into the HTML page: <p class="body" ...

Troubleshooting the IFrame error within Directus and Next.js when in draft mode

Currently, I am working on a project using Next.js and my next.conf.js file appears like this: /** @type {import('next').NextConfig} */ const nextConfig = { reactStrictMode: true, headers() { return [ { ...

Utilizing JQuery to Implement ngModel and ngBind in Angular Directives: A Step-by-Step Guide

[Note] My objective is to develop custom Angular directives that encapsulate all the necessary JS for them to function. The directives should not know what they are displaying or where to store user input values; these details will be passed in as attrib ...

Error encountered when attempting to convert a JSON object to a String using JSON.stringify(), due to a cyclic object value

I have a JSON object with the following structure: obj { name: "abc" , entriesList : "list of entry obj" , propertiesList : "list of properties obj" }; In this structure, an entry is also another object entry { info : "data obj" , ...

What is the reason for the function to return 'undefined' when the variable already holds the accurate result?

I have created a function that aims to calculate the digital root of a given number. Despite my efforts, I am encountering an issue where this function consistently returns undefined, even though the variable does hold the correct result. Can you help me ...