node.js - Error: no se puede leer la propiedad 0 de indefinido durante la implementación en Heroku

Desarrollé un proyecto de Angular 10 y preparé mi archivo package.json para implementarlo en Heroku. Puedes ver el paquete.json:

{
  "name": "rehabsoft-frontend",
  "version": "0.0.0",
  "scripts": {
    "ng": "ng",
    "start": "http-server-spa dist/rehabsoft-frontend index.html $PORT",
    "heroku-postbuild": "ng build --prod && npm install -g http-server-spa",
    "build": "ng build",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e",
    "build-themes": "devextreme build"
  },
  "private": true,
  "dependencies": {
    "@angular/animations": "~10.0.11",
    "@angular/cdk": "^10.2.7",
    "@angular/cli": "~10.0.7",
    "@angular/common": "~10.0.11",
    "@angular/compiler": "~10.0.11",
    "@angular/compiler-cli": "~10.0.11",
    "@angular/core": "~10.0.11",
    "@angular/forms": "~10.0.11",
    "@angular/platform-browser": "~10.0.11",
    "@angular/platform-browser-dynamic": "~10.0.11",
    "@angular/router": "~10.0.11",
    "@fortawesome/fontawesome-free": "^5.15.1",
    "@types/chart.js": "^2.9.27",
    "angular-bootstrap-md": "^10.0.0",
    "animate.css": "^4.1.1",
    "chart.js": "^2.5.0",
    "compression": "^1.7.4",
    "devextreme": "20.1.7",
    "devextreme-angular": "20.1.7",
    "devextreme-schematics": "^1.2.4",
    "express": "^4.17.1",
    "hammerjs": "^2.0.8",
    "ngx-cookie-service": "^10.1.1",
    "rxjs": "~6.5.5",
    "sweetalert2": "^10.10.3",
    "tslib": "^2.0.0",
    "typescript": "~3.9.5",
    "video.js": "^7.10.2",
    "zone.js": "~0.10.3"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "^0.1100.3",
    "@angular/cli": "~10.0.7",
    "@angular/compiler-cli": "~10.0.11",
    "@types/jasmine": "~3.5.0",
    "@types/jasminewd2": "~2.0.3",
    "@types/node": "^12.11.1",
    "codelyzer": "^6.0.0",
    "devextreme-cli": "latest",
    "devextreme-intl": "^19.1.8",
    "devextreme-themebuilder": "20.1.7",
    "jasmine-core": "~3.5.0",
    "jasmine-spec-reporter": "~5.0.0",
    "karma": "~5.0.0",
    "karma-chrome-launcher": "~3.1.0",
    "karma-coverage-istanbul-reporter": "~3.0.2",
    "karma-jasmine": "~3.3.0",
    "karma-jasmine-html-reporter": "^1.5.0",
    "protractor": "~7.0.0",
    "ts-node": "~8.3.0",
    "tslint": "~6.1.0",
    "typescript": "~3.9.5"
  },
  "engines": {
    "node": "14.15.5",
    "npm": "6.14.9"
  }
}

Después de enviarlo al Heroku, me dio este error:

- Generating browser application bundles...
✔ Browser application bundle generation complete.
Error: Cannot read property '0' of undefined
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! [email protected] heroku-postbuild: `ng build --prod && npm install -g http-server-spa`
npm ERR! Exit status 1
npm ERR! 
npm ERR! Failed at the [email protected] heroku-postbuild script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
npm ERR! A complete log of this run can be found in:
npm ERR!     /tmp/npmcache.E6zzA/_logs/2021-03-26T20_34_47_429Z-debug.log
-----> Build failed
       
       We're sorry this build is failing! You can troubleshoot common issues here:
       https://devcenter.heroku.com/articles/troubleshooting-node-deploys
       
       If you're stuck, please submit a ticket so we can help:
       https://help.heroku.com/
       
       Love,
       Heroku
       
 !     Push rejected, failed to compile Node.js app.
 !     Push failed

He intentado ejecutar ng build --prod && npm install -g http-server-spa y http-server-spa dist/rehabsoft-frontend index.html $PORT comandos en mi local, y todo funcionó como se esperaba. Sé que el error No se puede leer la propiedad '0' del error indefinido ocurre principalmente cuando hay un elemento de matriz indefinido en el código. Pero probé todo en mi local y funcionó perfectamente. ¿Hay algún error que no pude notar?

EDITAR: También ejecuto el comando heroku config:set NPM_CONFIG_LOGLEVEL=verbose para ver una salida de registro más detallada. Puedes ver el resultado de la compilación.después de ejecutar esto:

Compiling @angular/cdk/keycodes : es2015 as esm2015
Compiling @angular/cdk/observers : es2015 as esm2015
Compiling @angular/cdk/a11y : es2015 as esm2015
Compiling @angular/router : es2015 as esm2015
Compiling angular-bootstrap-md : es2015 as esm2015
- Generating browser application bundles...
✔ Browser application bundle generation complete.
Error: Cannot read property '0' of undefined
npm verb lifecycle [email protected]~heroku-postbuild: unsafe-perm in lifecycle true
npm verb lifecycle [email protected]~heroku-postbuild: PATH: /tmp/build_cfc9b878/.heroku/node/lib/node_modules/npm/node_modules/npm-lifecycle/node-gyp-bin:/tmp/build_cfc9b878/node_modules/.bin:/tmp/build_cfc9b878/.heroku/node/bin:/tmp/build_cfc9b878/.heroku/yarn/bin:/usr/local/bin:/usr/bin:/bin
npm verb lifecycle [email protected]~heroku-postbuild: CWD: /tmp/build_cfc9b878
npm info lifecycle [email protected]~heroku-postbuild: Failed to exec heroku-postbuild script
npm verb stack Error: [email protected] heroku-postbuild: `ng build --prod && npm install -g http-server-spa`
npm verb stack Exit status 1
npm verb stack     at EventEmitter.<anonymous> (/tmp/build_cfc9b878/.heroku/node/lib/node_modules/npm/node_modules/npm-lifecycle/index.js:332:16)
npm verb stack     at EventEmitter.emit (events.js:315:20)
npm verb stack     at ChildProcess.<anonymous> (/tmp/build_cfc9b878/.heroku/node/lib/node_modules/npm/node_modules/npm-lifecycle/lib/spawn.js:55:14)
npm verb stack     at ChildProcess.emit (events.js:315:20)
npm verb stack     at maybeClose (internal/child_process.js:1048:16)
npm verb stack     at Process.ChildProcess._handle.onexit (internal/child_process.js:288:5)
npm verb pkgid [email protected]
npm verb cwd /tmp/build_cfc9b878
npm verb Linux 4.4.0-1086-aws
npm verb argv "/tmp/build_cfc9b878/.heroku/node/bin/node" "/tmp/build_cfc9b878/.heroku/node/bin/npm" "run" "heroku-postbuild" "--if-present"
npm verb node v14.15.5
npm verb npm  v6.14.9
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! [email protected] heroku-postbuild: `ng build --prod && npm install -g http-server-spa`
npm ERR! Exit status 1
npm ERR! 
npm ERR! Failed at the [email protected] heroku-postbuild script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
npm verb exit [ 1, true ]
npm timing npm Completed in 326009ms
npm ERR! A complete log of this run can be found in:
npm ERR!     /tmp/npmcache.WBTLI/_logs/2021-03-27T09_47_12_360Z-debug.log
-----> Build failed
       
       We're sorry this build is failing! You can troubleshoot common issues here:
       https://devcenter.heroku.com/articles/troubleshooting-node-deploys
       
       If you're stuck, please submit a ticket so we can help:
       https://help.heroku.com/
       
       Love,
       Heroku
       
 !     Push rejected, failed to compile Node.js app.
 !     Push failed

------------------------------------

Cuando implemento aplicaciones frontend, en realidad encuentro que es más fácil trabajar con Netlify. ¿Lo has probado? Solo necesitas hacerlo.

npm install netlify-cli -g
netlify deploy

y también es gratis sin contingencias como horas de prueba gratuitas, otra alternativa son las páginas de Github

1

Gracias, probaré esta plataforma también.

-okydoky

27 de marzo de 2021 a las 11:56

------------------------------------

Encontré la causa de este problema. Desarrollé el proyecto en Windows 10. Cuando ejecuté la aplicación en un sistema Ubuntu, enfrenté algunos errores de compilación que no ocurrieron en mi sistema Windows. No sé por qué no recibí estos errores en Windows. Si alguien enfrenta este problema, primero debe probar su aplicación en Ubuntu para ver si realmente funciona.

------------------------------------

Intente eliminar paquete-lock.json Eliminar package-lock.json localmente Cometer cambios Volver a implementar en Heroku

Esta suele ser la solución cada vez que aparece este error en la implementación de Heroku:

Error: Cannot read property '<something>' of undefined