Multiple errors with deployment

I am working on a react website/app

My vercel is connected to my github repository found at GitHub - paulgrspam/AppealApp

initially, when I would go to deploy, my site would just show the content of my index.js file. I worked with another developer to try and resolve that issue with no success.

here is my site: https://appeal-generator-react.vercel.app/ you can see it just shows my index.js

To try and fix this, I updated my packages.json and changed my vercel build settings to the following

Now, when I try to build and deploy I get the following error:

[15:52:28.203] Running build in Washington, D.C., USA (East) – iad1
[15:52:28.340] Cloning GitHub - paulgrspam/AppealApp (Branch: master, Commit: 93daa94)
[15:52:28.854] Cloning completed: 512.835ms
[15:52:29.065] Restored build cache
[15:52:29.149] Running “vercel build”
[15:52:30.860] Vercel CLI 37.1.2
[15:52:31.753] Running “install” command: npm install --legacy-peer-deps
[15:53:34.337] npm warn deprecated sourcemap-codec@1.4.8: Please use @jridgewell/sourcemap-codec instead
[15:53:34.457] npm warn deprecated rollup-plugin-terser@7.0.2: This package has been deprecated and is no longer maintained. Please use @rollup/plugin-terser
[15:53:35.432] npm warn deprecated stable@0.1.8: Modern JS already guarantees Array#sort() is a stable sort, so this library is deprecated. See the compatibility table on MDN: Array.prototype.sort() - JavaScript | MDN
[15:53:35.592] npm warn deprecated workbox-cacheable-response@6.6.0: workbox-background-sync@6.6.0
[15:53:35.596] npm warn deprecated q@1.5.1: You or someone you depend on is using Q, the JavaScript Promise library that gave JavaScript developers strong feelings about promises. They can almost certainly migrate to the native JavaScript promise now. Thank you literally everyone for joining me in this bet against the odds. Be excellent to each other.
[15:53:35.596] npm warn deprecated
[15:53:35.597] npm warn deprecated (For a CapTP with native promises, see @endo/eventual-send and @endo/captp)
[15:53:36.002] npm warn deprecated workbox-google-analytics@6.6.0: It is not compatible with newer versions of GA starting with v4, as long as you are using GAv3 it should be ok, but the package is not longer being maintained
[15:53:36.597] npm warn deprecated w3c-hr-time@1.0.2: Use your platform’s native performance.now() and performance.timeOrigin.
[15:53:36.598] npm warn deprecated domexception@2.0.1: Use your platform’s native DOMException instead
[15:53:36.599] npm warn deprecated abab@2.0.6: Use your platform’s native atob() and btoa() methods instead
[15:53:36.899] npm warn deprecated glob@7.2.3: Glob versions prior to v9 are no longer supported
[15:53:36.928] npm warn deprecated inflight@1.0.6: This module is not supported, and leaks memory. Do not use it. Check out lru-cache if you want a good and tested way to coalesce async requests by a key value, which is much more comprehensive and powerful.
[15:53:37.616] npm warn deprecated @babel/plugin-proposal-optional-chaining@7.21.0: This proposal has been merged to the ECMAScript standard and thus this plugin is no longer maintained. Please use @babel/plugin-transform-optional-chaining instead.
[15:53:37.618] npm warn deprecated @babel/plugin-proposal-class-properties@7.18.6: This proposal has been merged to the ECMAScript standard and thus this plugin is no longer maintained. Please use @babel/plugin-transform-class-properties instead.
[15:53:37.618] npm warn deprecated @babel/plugin-proposal-private-methods@7.18.6: This proposal has been merged to the ECMAScript standard and thus this plugin is no longer maintained. Please use @babel/plugin-transform-private-methods instead.
[15:53:37.618] npm warn deprecated @babel/plugin-proposal-numeric-separator@7.18.6: This proposal has been merged to the ECMAScript standard and thus this plugin is no longer maintained. Please use @babel/plugin-transform-numeric-separator instead.
[15:53:37.638] npm warn deprecated @babel/plugin-proposal-nullish-coalescing-operator@7.18.6: This proposal has been merged to the ECMAScript standard and thus this plugin is no longer maintained. Please use @babel/plugin-transform-nullish-coalescing-operator instead.
[15:53:39.196] npm warn deprecated rimraf@3.0.2: Rimraf versions prior to v4 are no longer supported
[15:53:39.578] npm warn deprecated @humanwhocodes/object-schema@2.0.3: Use @eslint/object-schema instead
[15:53:39.769] npm warn deprecated @humanwhocodes/config-array@0.11.14: Use @eslint/config-array instead
[15:53:41.615] npm warn deprecated svgo@1.3.2: This SVGO version is no longer supported. Upgrade to v2.x.x.
[15:53:46.219]
[15:53:46.219] added 1524 packages, and audited 1525 packages in 1m
[15:53:46.220]
[15:53:46.220] 261 packages are looking for funding
[15:53:46.220] run npm fund for details
[15:53:46.227]
[15:53:46.227] 8 vulnerabilities (2 moderate, 6 high)
[15:53:46.227]
[15:53:46.228] To address all issues (including breaking changes), run:
[15:53:46.228] npm audit fix --force
[15:53:46.228]
[15:53:46.228] Run npm audit for details.
[15:53:46.450] node:internal/modules/cjs/loader:1228
[15:53:46.451] throw err;
[15:53:46.451] ^
[15:53:46.451]
[15:53:46.451] Error: Cannot find module ‘/vercel/path0/src/package.json’
[15:53:46.452] Require stack:
[15:53:46.452] - /vercel/path0/node_modules/react-scripts/config/paths.js
[15:53:46.452] - /vercel/path0/node_modules/react-scripts/config/env.js
[15:53:46.452] - /vercel/path0/node_modules/react-scripts/scripts/build.js
[15:53:46.452] at Module._resolveFilename (node:internal/modules/cjs/loader:1225:15)
[15:53:46.452] at Module._load (node:internal/modules/cjs/loader:1051:27)
[15:53:46.453] at Module.require (node:internal/modules/cjs/loader:1311:19)
[15:53:46.453] at require (node:internal/modules/helpers:179:18)
[15:53:46.453] at Object. (/vercel/path0/node_modules/react-scripts/config/paths.js:28:3)
[15:53:46.453] at Module._compile (node:internal/modules/cjs/loader:1469:14)
[15:53:46.453] at Module._extensions…js (node:internal/modules/cjs/loader:1548:10)
[15:53:46.453] at Module.load (node:internal/modules/cjs/loader:1288:32)
[15:53:46.454] at Module._load (node:internal/modules/cjs/loader:1104:12)
[15:53:46.454] at Module.require (node:internal/modules/cjs/loader:1311:19) {
[15:53:46.454] code: ‘MODULE_NOT_FOUND’,
[15:53:46.454] requireStack: [
[15:53:46.454] ‘/vercel/path0/node_modules/react-scripts/config/paths.js’,
[15:53:46.454] ‘/vercel/path0/node_modules/react-scripts/config/env.js’,
[15:53:46.455] ‘/vercel/path0/node_modules/react-scripts/scripts/build.js’
[15:53:46.455] ]
[15:53:46.455] }
[15:53:46.455]
[15:53:46.455] Node.js v20.17.0
[15:53:46.461] Error: Command “react-scripts build” exited with 1
[15:53:46.846]

I can deploy my react website locally with no problems, and I can see my pages correctly.

Please help me figure out what I need to change to get my website to deploy on vercel

Hi, @paulgrspam!

Could you try the solution I shared here?

Hi Pawlean thank you for trying to help me with this.

I completely deleted my vercel.json and I get the same deployment errors:

Error: Cannot find module ‘/vercel/path0/src/package.json’

08:13:21.193Require stack:

08:13:21.193- /vercel/path0/node_modules/react-scripts/config/paths.js

08:13:21.193- /vercel/path0/node_modules/react-scripts/config/env.js

08:13:21.193- /vercel/path0/node_modules/react-scripts/scripts/build.js

08:13:21.193 at Module._resolveFilename (node:internal/modules/cjs/loader:1225:15)

08:13:21.193 at Module._load (node:internal/modules/cjs/loader:1051:27)

08:13:21.193 at Module.require (node:internal/modules/cjs/loader:1311:19)

08:13:21.193 at require (node:internal/modules/helpers:179:18)

08:13:21.193 at Object. (/vercel/path0/node_modules/react-scripts/config/paths.js:28:3)

08:13:21.193 at Module._compile (node:internal/modules/cjs/loader:1469:14)

08:13:21.193 at Module._extensions…js (node:internal/modules/cjs/loader:1548:10)

08:13:21.193 at Module.load (node:internal/modules/cjs/loader:1288:32)

08:13:21.193 at Module._load (node:internal/modules/cjs/loader:1104:12)

08:13:21.193 at Module.require (node:internal/modules/cjs/loader:1311:19) {

08:13:21.193 code: ‘MODULE_NOT_FOUND’,

08:13:21.193 requireStack: [

08:13:21.193 ‘/vercel/path0/node_modules/react-scripts/config/paths.js’,

08:13:21.193 ‘/vercel/path0/node_modules/react-scripts/config/env.js’,

08:13:21.193 ‘/vercel/path0/node_modules/react-scripts/scripts/build.js’

08:13:21.193 ]

08:13:21.193}

08:13:21.193

08:13:21.193Node.js v20.17.0

08:13:21.200Error: Command “react-scripts build” exited with 1

I tried to debug using an LLM, and it suggested the custom build settings from my original post. Could these be causing the issue?

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.