Encountered an issue when trying to deploy NextJS application to AWS using the serverless framework

Encountered an issue while deploying my NextJS app to AWS using the serverless framework.

After running npx serverless in my Next JS app directory, I received the following error:

$ npx serverless

  error:
  Error: Command failed with ENOENT: node_modules/.bin/next build
spawn node_modules/.bin/next ENOENT
'node_modules\.bin\next' is not recognized as an internal or external command,
operable program or batch file.
    at notFoundError (C:\Users\patel\.serverless\components\registry\npm\@sls-next\ [email protected] \node_modules\@sls-next\serverless-component\node_modules\cross-spawn\lib\enoent.js:6:26)
    at verifyENOENT (C:\Users\patel\.serverless\components\registry\npm\@sls-next\ [email protected] \node_modules\@sls-next\serverless-component\node_modules\cross-spawn\lib\enoent.js:40:16)
    at ChildProcess.cp.emit (C:\Users\patel\.serverless\components\registry\npm\@sls-next\ [email protected] \node_modules\@sls-next\serverless-component\node_modules\cross-spawn\lib\enoent.js:27:25)
    at Process.ChildProcess._handle.onexit (internal/child_process.js:277:12) {
  code: 'ENOENT',
  errno: 'ENOENT',
  syscall: 'spawn node_modules/.bin/next',
  path: 'node_modules/.bin/next',
  spawnargs: [ 'build' ],
  originalMessage: 'spawn node_modules/.bin/next ENOENT',
  shortMessage: 'Command failed with ENOENT: node_modules/.bin/next build\n' +
    'spawn node_modules/.bin/next ENOENT',
  command: 'node_modules/.bin/next build',
  exitCode: undefined,
  signal: undefined,
  signalDescription: undefined,
  stdout: '',
  stderr: "'node_modules\\.bin\\next' is not recognized as an internal or external command,\r\n" +
    'operable program or batch file.',
  failed: true,
  timedOut: false,
  isCanceled: false,
  killed: false
}

  3s » myNextApplication » Error: Command failed with ENOENT: node_modules/.bin/next build
spawn node_modules/.bin/next ENOENT
'node_modules\.bin\next' is not recognized as an internal or external command,
operable program or batch file.

Utilizing aws configure for setting up my AWS credentials.

The content of my serverless.yml file is as follows:

myNextApplication:
  component: "@sls-next/<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="423127303427302e2731316f212d2f322d2c272c3602736c737a6c72">[email protected]</a>"

Seeking assistance on deploying my app to AWS cloud using a serverless framework.

Thank you.

javascriptamazon-web-servicesnext.jsserverless-frameworkaws-serverless

Answer №1

Encountering a similar issue, I faced the challenge within my development environment set up within a unified monorepo structure utilizing yarn workspaces and lerna. The root of the monorepo had declared next as a shared dependency, while the particular nextjs application I aimed to deploy did not explicitly list this dependency in its package.json.

In order for serverless functionality to execute smoothly, it was imperative that this dependency be specified within the application's package.json file as well.

To resolve my situation, I simply added:

"next": "11.1.3-canary.49",

under dependencies. This adjustment enabled serverless to successfully execute the command as needed.

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

End node.js once and for all

After starting my server using forever start start.js It ran normally. However, when I attempted to stop it with forever stopall The server was removed from forever list as expected Nevertheless, upon running lsof -i tcp:3000, my server still showed u ...

javascriptnode.jsserverforever

Inquiring about react-hook-form: why does getValues not retrieve the latest value?

I am facing an issue with my radio buttons labeled A, B, and C. Specifically, under button B, there is a select box that I want to make 'required' only when B is selected. Below is the simplified code snippet: interface ButtonFormType { not ...

reactjsnext.jsreact-hook-formchakra-ui

Despite being used within useEffect with await, asynchronous function fails to wait for results

In my component, I am utilizing a cookie value to determine which component or div block to display. The functionality works correctly in the end, but there is a brief moment where it seems like the cookie value is not being checked yet. During this short ...

javascriptreactjs

Trigger file download with ajax and php

I have been using an image picker plugin to select an image and then force it to download. Initially, I hard coded the PHP which worked perfectly fine. The download pop-up appeared and I was able to view the file without any issues. However, when trying to ...

javascriptphpjqueryajax

Is there a way for me to delay sending an immediate response until the asynchronous loop has completed?

Currently trying to implement something similar to the code snippet below. I suspect that the issue lies within the asynchronous call as it seems like the response I am getting is always an empty array, despite the API returning data. As a beginner in th ...

javascriptnode.jsexpressasynchronousaxios

Attempting to create a Next.js 13 application, but struggling with using the client-side functionality

Exploring Next.js for the first time, I embarked on creating a simple application. Everything was going smoothly until I attempted to include a "use client" tag at the beginning of a component to utilize certain hooks. This resulted in the app breaking and ...

javascriptreactjsnext.jserror-handling

Updating DOM elements in AngularJS based on search results and user clicks

I have a query regarding my angular web app, which includes an ajax call for json-formatted dates to display them in a table. The app features a search input, two sorting buttons (for age or name), and a profile sidebar element. I have successfully update ...

javascriptangularjs

The intersectsBox function unexpectedly returns true instead of false

I recently came across a tutorial on MDN that discussed the intersection of bounding boxes. Intrigued, I decided to try out the code snippet provided: const testBoxGeometry = new THREE.BoxGeometry(3, 3, 3); const testBoxMaterial = new THREE.MeshBasicM ...

javascript3dthree.js

Heroku is unable to find tsc when I try to deploy my React, Next.js, and Node project

I am currently working on a project using React, Next.js, and Node.js. My goal is to deploy this project on Heroku. The structure of my project can be seen here: https://i.stack.imgur.com/Ap6aB.png Here is a link to my package.json file: https://i.stack.i ...

node.jsreactjsherokunext.js

Issue: Unable to create the restangular module because: the variable '_' is not defined

Upon integrating Restangular into an existing website, I encountered a JavaScript error that stated: Failed to instantiate module restangular due to: '_' is undefined I'm unsure of what this means. Can anyone clarify why '_' is ...

javascripthtmlangularjsrestangular

Re-activate external script following a language update in Next.js

In my Next.js 13 app, I have implemented a live chat support button that is dynamically added based on the language selection. The code for rendering the button looks like this: import Script from 'next/script'; ... <div id={`onlinehelp-button ...

javascriptreactjsnext.jsnext.js13

Can a webpage be sent to a particular Chromecast device without using the extension through programming?

My organization has strategically placed multiple Chromecasts across our facility, each dedicated to displaying a different webpage based on its location. Within my database, I maintain a record of the Chromecast names and their corresponding URLs. These d ...

javascripthtmlgoogle-chromechromecastgoogle-cast

What is the best way to update a deeply nested array of objects?

I have an array of objects with nested data that includes product, task, instrument details, and assets. I am attempting to locate a specific instrument by supplier ID and modify its asset values based on a given number. const data = [ { // Data for ...

javascriptarraysjsontypescript

Modify the text highlighted in bold within the AngularJS application

In my angular.js application, I have a table that displays elements. The name of these elements sometimes needs to be displayed in bold by adding <b> and </b> tags. However, instead of rendering the name as HTML code, it is showing up as a stri ...

javascriptangularjs

How to deal with an empty $_FILES array when there is file data present in $_POST

After reviewing multiple solutions, I noticed that they all utilize jQuery's .ajax() method. However, I have developed a more concise vanilla JS approach which has been quite successful for me. function ajax(options){ var settings = { met ...

javascriptphpajaxfileform-data

Tips for injecting an Angular variable into a JavaScript variable

Within my angular controller, I have a function defined as follows: $scope.get_all_places = function () { $http.get("get-all-places").then(function (response) { $scope.selected_place = eval(response.data[0]); }); }; I am trying to assign ...

javascriptjqueryangularjs

Having trouble with the `click()` function not working on a button while using Selenium in

Currently, I am running a selenium test on a remote server in headless mode using the chrome driver. However, when trying to click on a button with the following step, the button does not get clicked. Below is the test step attempting to click the element ...

javascriptseleniumselenium-chromedriverheadless-browser

The fadein feature in Deps.Autorun is not functioning as expected in Meteor version 0.5.9

Here is the code I am currently working with: Template.jobFlash.helpers({ latest_job: function(){ if(Session.get("latestJob")!=""){ return JobsCollection.findOne({}, {sort: {'added_date': -1}}); } } }); Deps. ...

javascriptjquerynode.jsmeteor

Having trouble with getting v-cloak to function properly when dealing with asynchronous requests

I wanted to explore using the v-cloak directive to showcase a loading spinner while certain data properties in vue js are being loaded asynchronously for me to integrate into a table component. After successfully applying and styling my v-cloak styles on ...

javascriptvue.jsvuejs2

Will cancelling a fetch request on the frontend also cancel the corresponding function on the backend?

In my application, I have integrated Google Maps which triggers a call to the backend every time there is a zoom change or a change in map boundaries. With a database of 3 million records, querying them with filters and clustering on the NodeJS backend con ...

javascriptmysqlnode.jsreactjsfetch