Issue encountered! The command "npm run build" resulted in an exit status of 1 during the deployment of a website via the vercel command

I have been attempting to deploy a website on Vercel from my VSCode command line using the following command:

vercel

Upon executing this command, I receive the following output: https://i.sstatic.net/JK9CY.png

When I run:

vercel logs demo-minting-frontend-rga7f9q73-hemang-h.vercel.app

The output is as follows:

PS C:\CS\Three.js\Marketplace-three\Self-coded-creation> vercel logs demo-minting-frontend-rga7f9q73-hemang-h.vercel.app
Vercel CLI 24.0.0
... (output continues)
2022-03-07T15:37:12.463Z

In an attempt to address the warnings, I proceeded to execute:

npm install uuid

To install the latest version of UUID and potentially bypass the first warning. However, despite this, running the vercel command still yielded similar logs.

I also tried adjusting the build settings to CI=False on Vercel under project settings, but unfortunately, did not receive a successful response.

My package.json is structured like this:

{
   "name": "demo-minting-page",
   "version": "1.0.0",
   ... (package.json content continues)
}

The .eslintrc.json configuration is as follows:

{
    "root": true,
    "extends": "next",
    ... (.eslintrc.json content continues)
}

You can find the complete code in my GitHub repository linked below: Github repo

Any assistance or guidance in resolving these issues would be greatly appreciated.

P.S: The functionality works perfectly fine on localhost:3000 without any bugs. Running npm run dev multiple times on my terminal hasn't raised any concerns while on localhost.

javascriptnpmdeploymentbuildvercel

Answer №1

There are a couple of approaches to solve the issue at hand.

  1. It appears that unnecessary modules are being imported in certain js files without being utilized. To address this, refrain from importing modules that are not actively used on the page. Only import a module when it is essential for the functionality.

  1. To rectify the issue, consider installing the following module: 

    npm install --save-dev eslint-plugin-react.
    (for developers using NPM) or 
    yarn add --dev eslint-plugin-react.
    (for those utilizing Yarn).

    Next, update your .eslintrc.json file by adding the following plugin under extends:

    'extends': [
    'plugin:react/recommended'
]

By implementing any of these recommendations, you may find resolution to the error encountered.

Answer №2

An important problem arises when imported variables remain unused. It is recommended to eliminate these variables that are not being used, and then execute the command npm run build on your personal computer to check for any remaining errors. Once this step is completed, you can proceed with deploying the changes to Vercel.

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

Accessing GitHub via SSH from within a GitHub Action runner on macOS

Currently, I am facing an issue with building an auto-deploy workflow on GitHub Action. The problem arises because one of my packages relies on a private repository owned by me. Every time I execute the command npm i, I encounter the following error: npm E ...

gitmacosnpmgithub-actions

When "this" doesn't refer to the current object, how to self reference an object

I am currently working on developing a modular series of element handlers for an application that features pages with different configurations. For example, the 'Hex T' configuration includes elements labeled from 'A' to 'O', ...

javascriptjqueryobject

Is there a way to replicate onbeforeunload in a Vue.js 2 application?

I have a Vue component that is monitoring whether it has unsaved changes. I want to alert the user before they move away from the current form if there are unsaved modifications. In a traditional web application, you could use onbeforeunload. I tried imple ...

javascriptvue.jsvuejs2vue-router

I am facing difficulty in installing the Workbox CLI on my system

My attempt at creating a service worker using the workbox CLI began with entering npm install workbox-cli --global. Here's what happened next: (c) Microsoft Corporation. All rights reserved. C:\Users\turbn>npm install workbox-cli --glo ...

npmworkbox

Can you explain the contrast between .npmignore and .gitignore files?

Can you explain the distinction between .npmignore and .gitignore? Additionally, which types of files should be excluded in each file? ...

gitnpmgitignorenpmignore

utilizing vue model attributes with `${}`

I am encountering an issue with my code. Initially, :src="labels[index]" was working fine for me. However, as my codebase expanded, I needed to use ${app.labels[index]}. Simply using ${app.labels} works, but the addition of [index] causes it to b ...

javascriptvue.js

Transmitting occasional feedback from ASP.NET Web API function to jQuery AJAX

I am currently working on a project that requires sending intermittent status responses from a Web API method back to a jQuery AJAX call in order to display progress in the UI. https://i.sstatic.net/Y6R4w.png The process involves the jQuery AJAX calling ...

javascriptasp.netasp.net-web-apitypescriptlong-polling

Using QuerySelector with Angular Directive will throw an error as it is not a recognized

When creating a directive that integrates a jQuery carousel, I want to hide it at the beginning until it is fully ready. Here's the directive code snippet: return { restrict: 'E', replace: true, scope: true, templateUrl: ...

javascriptjqueryangularjsdirective

Unable to apply custom border color to Material UI Select component in React

I have been experimenting with material-ui v5 to improve my skills. I am currently struggling to customize the default style of the mui Select component. My goal is to modify the color of the Select element when it is being hovered over or in a focused sta ...

javascriptcssreactjsmaterial-ui

Do devDependencies get installed when running `npm install -g my-package` command?

After browsing through this forum discussion, I found the answers a bit confusing and not directly addressing my concern. Therefore, I am posing a specific question: When using the command npm install -g my-package, are the dependencies listed under devDe ...

javascriptnode.jsnpmdependencies

I am looking to dynamically assign an href attribute to a link using a variable within my script. How can I achieve

I am working on displaying an image inside a jQuery slider with the following HTML markup:- <li> <figure> <a href="~/img/big.jpg" class="thumb"> <img src="~/img/small.jpg" alt=""/> <span> ...

javascriptjqueryasp.net-mvc

An unforeseen issue occurred with UrlFetchApp.fetch while using basic authentication in Google Apps Script

I am currently using Google Apps Script to fetch CSV data from a webpage using basic authentication and insert it into a spreadsheet. Below is the code snippet I am working with: CSVImport.gs function parseCSVtoSheet(sheetName, url) { // Credentials v ...

javascriptgoogle-apps-scriptbasic-authenticationurlfetch

Trouble with Excel Office Script setInterval functionality

Trying to automatically recalculate an Excel worksheet every second using Office Script. Unfortunately, my initial approach did not succeed. function sendUpdate(sheet: ExcelScript.Worksheet) { console.log('hi'); sheet.calculate(true); } func ...

javascriptexceltypescriptoffice-scripts

Whether it's nvm or npm, getting those packages installed

Whenever I navigate to the ~/tmp directory and execute npm install eslint on one particular system the eslint package gets installed at ~/.nvm/versions/node/v10.17.0/lib/node_modules/eslint (and is accessible through which eslint because ~/.nvm/.. is ad ...

node.jsnpmnvm

execute a setTimeout function in ReactJs to render a component after a specified amount of time

Is there a way to render a component inside my App.Js after a certain amount of time using setTimeout? I've tried, but nothing seems to be happening... This is my code: function App() { return ( <Router> <GlobalStyle /> ...

javascriptreactjssettimeout

Transferring JSON information from Express to Backbone

I have developed a basic Backbone application and am trying to integrate JSON data from a MYSQL database using an Express server. However, when I make a GET request with Express to fetch data for Backbone, the html template in Backbone disappears, leaving ...

javascriptjsonnode.jsbackbone.jsexpress

Having trouble identifying whether a file is a picture or video based solely on its extension

My current challenge involves determining whether an uploaded file is a video or a photo. This distinction is crucial as it dictates whether the file should be sent to my telegram bot as a video or photo attachment. Despite having what seems like a logica ...

javascriptnode.jsexpressformidable

tips for replacing multiple route parameters in Angular using the replace function

I am facing an issue when trying to replace multiple parameters using the angular replace function. The problem is that the function only detects the first parameter. For example, if I have this route admin/management/{type}/card/{id}, and use the route.r ...

javascriptangular

Upon loading the page, trigger the controller method by utilizing the information from the query string

Can query string data be retrieved on page load with javascript? Here is how I am attempting to achieve this in my project: The view page displays tabular data. When a button is pressed, it retrieves the row's id and invokes a javascript function. ...

javascriptjqueryasp.netasp.net-mvcasp.net-mvc-4

Earlier on a functioning `gulp` project: When executing `npm update`, an error is thrown related to `tar.unpack untar

Initially, my project was functioning perfectly fine. However, diligent individuals who were contributing to the repository introduced new dependencies which led to numerous tar.unpack untar errors when I try to run npm update. How can I resolve this issue ...

node.jsnpmgulp