1

I have a app that is currently deployed on heroku and working perfectly fine. I created a new heroku app and tried to run the same branch. I installed nodejs and all the configuration is the same but for some reason the build is failing at heroku-postbuild: "ng build --prod". It works fine on the previous instance I have on heroku but wont work on the new one. I don't know what i am missing as the information on the error is minimal. I am attaching my package.json as well as the error message I get. any help will be appreciated and let me know if you need me to upload anything else.

package.json

  {
  "name": "eserver",
  "version": "0.0.0",
  "scripts": {
    "ng": "ng",
    "main": "server.js",
    "heroku-postbuild": "ng build --prod",
    "preinstall": "npm install -g @angular/cli @angular/compiler-cli typescript",
    "start": "ng serve",
    "build": "ng build",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e"
  },
  "private": true,
  "dependencies": {
    "@angular/animations": "^11.0.5",
    "@angular/cdk": "^11.0.3",
    "@angular/common": "^11.0.5",
    "@angular/compiler": "11.0.5",
    "@angular/compiler-cli": "^11.0.5",
    "@angular/core": "^11.0.5",
    "@angular/flex-layout": "^11.0.0-beta.33",
    "@angular/forms": "^11.0.5",
    "@angular/localize": "^11.0.5",
    "@angular/material": "^11.0.3",
    "@angular/platform-browser": "11.0.5",
    "@angular/platform-browser-dynamic": "11.0.5",
    "@angular/router": "11.0.5",
    "ng2-charts-schematics": "^0.1.7",
    "@angular-devkit/build-angular": "^0.1100.5",
    "@angular/cli": "11.0.5",
    "@angular/language-service": "^11.0.5",
    "@fortawesome/fontawesome-free": "^5.15.1",
    "@types/chartist": "^0.11.0",
    "@types/jasmine": "~2.8.6",
    "@types/jasminewd2": "~2.0.3",
    "@types/lodash": "^4.14.135",
    "@types/node": "^8.10.66",
    "@types/uuid": "^8.3.0",
    "angular-cli-ghpages": "^0.6.2",
    "protractor": "^7.0.0",
    "ts-node": "~5.0.1",
    "@ng-bootstrap/ng-bootstrap": "^5.3.1",
    "@ng-bootstrap/schematics": "^2.0.0-alpha.1",
    "@ngtools/webpack": "^11.0.5",
    "@ngx-translate/core": "13.0.0",
    "@ngx-translate/http-loader": "^4.0.0",
    "@types/chart.js": "^2.7.42",
    "@types/express": "^4.17.0",
    "@types/w3c-web-usb": "^1.0.4",
    "@types/web-bluetooth": "0.0.4",
    "angular-bootstrap-md": "^7.4.3",
    "angular-cc-library": "^2.1.2",
    "angular-notifier": "^4.1.1",
    "angular-responsive-carousel": "^2.0.2",
    "angular5-csv": "^0.2.11",
    "apexcharts": "^3.25.0",
    "bcryptjs": "^2.4.3",
    "body-parser": "^1.18.3",
    "bootstrap": "^4.5.3",
    "chart.js": "^2.9.4",
    "chartist": "^0.11.4",
    "config": "^3.3.6",
    "core-js": "^2.5.4",
    "cors": "^2.8.5",
    "css-loader": "^2.1.0",
    "dotenv": "^6.1.0",
    "exec": "^0.2.1",
    "express": "^4.16.4",
    "express-jwt": "^5.3.1",
    "express-sslify": "^1.2.0",
    "font-awesome": "^4.7.0",
    "fontawesome": "^5.6.3",
    "got": "^11.8.1",
    "hammerjs": "^2.0.8",
    "jsonwebtoken": "^8.2.2",
    "ldbutton": "^1.0.2",
    "lodash": "^4.17.11",
    "mat-table-exporter": "^1.0.2",
    "material-design-lite": "^1.3.0",
    "mdb-angular-ui-kit": "^1.0.0-alpha3",
    "mdbootstrap": "^4.19.2",
    "mongodb": "^3.0.10",
    "mongoose": "^5.1.4",
    "ng-apexcharts": "^1.5.8",
    "ng-chartist": "^4.1.0",
    "ng-multiselect-dropdown": "^0.2.3",
    "ng-thermal-print": "^1.0.3",
    "ng2-charts": "^2.4.2",
    "ngx-autosize": "^1.8.4",
    "ngx-bootstrap": "^6.2.0",
    "ngx-chess-board": "^2.0.7",
    "node-sass": "^4.14.1",
    "path": "^0.12.7",
    "popper.js": "^1.15.0",
    "pusher": "^2.2.0",
    "pusher-js": "^4.4.0",
    "readable-stream": "^3.6.0",
    "remote-pay-cloud": "3.1.0",
    "remote-pay-cloud-api": "^4.0.3",
    "request": "^2.88.2",
    "request-promise": "^4.2.4",
    "resize-base64": "^1.0.12",
    "rootpath": "^0.1.2",
    "rxjs": "^6.5.2",
    "rxjs-compat": "^6.3.3",
    "time-ago-pipe": "^1.3.2",
    "tslib": "^1.9.0",
    "typescript": "4.0.5",
    "uuid": "^3.3.2",
    "web-animations-js": "^2.3.2",
    "zone.js": "~0.10.3"
  },
  "devDependencies": {
    "@angular-devkit/core": "^11.0.5",
    "@angular-devkit/schematics": "^11.0.5",
    "codelyzer": "^5.0.1",
    "jasmine-core": "~2.99.1",
    "jasmine-spec-reporter": "~4.2.1",
    "karma": "~5.1.1",
    "karma-chrome-launcher": "~2.2.0",
    "karma-coverage-istanbul-reporter": "~2.0.0",
    "karma-jasmine": "~1.1.1",
    "karma-jasmine-html-reporter": "^0.2.2",
    "ng2-charts-schematics": "^0.1.7",
    "protractor": "^7.0.0",
    "ts-node": "~5.0.1",
    "tslint": "~6.1.3"
  },
  "engines": {
    "node": "10.13",
    "npm": "6.9.0"
  }
}

log and Error I am getting when deploying on heroku:

Building on the Heroku-20 stack
-----> Using buildpack: heroku/nodejs
-----> Node.js app detected
       
-----> Creating runtime environment
       
       NPM_CONFIG_LOGLEVEL=error
       NODE_VERBOSE=false
       NODE_ENV=production
       NODE_MODULES_CACHE=true
       
-----> Installing binaries
       engines.node (package.json):  10.13
       engines.npm (package.json):   6.9.0
       
       Resolving node version 10.13...
       Downloading and installing node 10.13.0...
       Bootstrapping npm 6.9.0 (replacing 6.4.1)...
       npm 6.9.0 installed
       
-----> Restoring cache
       - node_modules
       
-----> Installing dependencies
       Installing node modules (package.json)
       
       > eserver@0.0.0 preinstall /tmp/build_d00ecea7
       > npm install -g @angular/cli @angular/compiler-cli typescript
       
       /tmp/build_d00ecea7/.heroku/node/bin/ng -> /tmp/build_d00ecea7/.heroku/node/lib/node_modules/@angular/cli/bin/ng.js
       /tmp/build_d00ecea7/.heroku/node/bin/ngcc -> /tmp/build_d00ecea7/.heroku/node/lib/node_modules/@angular/compiler-cli/bundles/ngcc/main-ngcc.js
       /tmp/build_d00ecea7/.heroku/node/bin/ngc -> /tmp/build_d00ecea7/.heroku/node/lib/node_modules/@angular/compiler-cli/bundles/src/bin/ngc.js
       /tmp/build_d00ecea7/.heroku/node/bin/ng-xi18n -> /tmp/build_d00ecea7/.heroku/node/lib/node_modules/@angular/compiler-cli/bundles/src/bin/ng_xi18n.js
       /tmp/build_d00ecea7/.heroku/node/bin/tsc -> /tmp/build_d00ecea7/.heroku/node/lib/node_modules/typescript/bin/tsc
       /tmp/build_d00ecea7/.heroku/node/bin/tsserver -> /tmp/build_d00ecea7/.heroku/node/lib/node_modules/typescript/bin/tsserver
       
       > @angular/cli@13.1.4 postinstall /tmp/build_d00ecea7/.heroku/node/lib/node_modules/@angular/cli
       > node ./bin/postinstall/script.js
       
       + @angular/cli@13.1.4
       + typescript@4.5.5
       + @angular/compiler-cli@13.1.3
       added 271 packages from 168 contributors in 10.621s
       audited 2004 packages in 17.813s
       found 45 vulnerabilities (2 low, 26 moderate, 17 high)
         run `npm audit fix` to fix them, or `npm audit` for details
       
-----> Build
       Detected both "build" and "heroku-postbuild" scripts
       Running heroku-postbuild
       
       > eserver@0.0.0 heroku-postbuild /tmp/build_d00ecea7
       > npm i && ng build --prod
       
       
       > eserver@0.0.0 preinstall /tmp/build_d00ecea7
       > npm install -g @angular/cli @angular/compiler-cli typescript
       
       /tmp/build_d00ecea7/.heroku/node/bin/ng -> /tmp/build_d00ecea7/.heroku/node/lib/node_modules/@angular/cli/bin/ng.js
       /tmp/build_d00ecea7/.heroku/node/bin/ngc -> /tmp/build_d00ecea7/.heroku/node/lib/node_modules/@angular/compiler-cli/bundles/src/bin/ngc.js
       /tmp/build_d00ecea7/.heroku/node/bin/ng-xi18n -> /tmp/build_d00ecea7/.heroku/node/lib/node_modules/@angular/compiler-cli/bundles/src/bin/ng_xi18n.js
       /tmp/build_d00ecea7/.heroku/node/bin/ngcc -> /tmp/build_d00ecea7/.heroku/node/lib/node_modules/@angular/compiler-cli/bundles/ngcc/main-ngcc.js
       /tmp/build_d00ecea7/.heroku/node/bin/tsc -> /tmp/build_d00ecea7/.heroku/node/lib/node_modules/typescript/bin/tsc
       /tmp/build_d00ecea7/.heroku/node/bin/tsserver -> /tmp/build_d00ecea7/.heroku/node/lib/node_modules/typescript/bin/tsserver
       
       > @angular/cli@13.1.4 postinstall /tmp/build_d00ecea7/.heroku/node/lib/node_modules/@angular/cli
       > node ./bin/postinstall/script.js
       
       + @angular/compiler-cli@13.1.3
       + @angular/cli@13.1.4
       + typescript@4.5.5
       updated 3 packages in 3.453s
       audited 2004 packages in 11.332s
       found 45 vulnerabilities (2 low, 26 moderate, 17 high)
         run `npm audit fix` to fix them, or `npm audit` for details
    'node-sass' usage is deprecated and will be removed in a future major version. To opt-out of the deprecated behaviour and start using 'sass' uninstall 'node-sass'.
- Generating browser application bundles...
✔ Browser application bundle generation complete.
Error: compiler_1.getMissingNgModuleMetadataErrorData is not a function
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! eserver@0.0.0 heroku-postbuild: `npm i && ng build --prod`
npm ERR! Exit status 1
npm ERR! 
npm ERR! Failed at the eserver@0.0.0 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.CSj5i/_logs/2022-01-26T03_37_12_096Z-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

2 Answers 2

0

Check if HEROKU_API_KEY is correct and that heroku_app_name is unique. Also this line seems sketcy: Detected both "build" and "heroku-postbuild" scripts Running heroku-postbuild. Maybe refactor heroku-postbuild in build and run only build.

  "scripts": {
    "ng": "ng",
    "main": "server.js",
    "preinstall": "npm install -g @angular/cli @angular/compiler-cli typescript",
    "start": "ng serve",
    "build": "ng build --prod",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e"
  },
4
  • Thanks for the help, I tried both the build script alone and the heroku-postbuild by it's self but still no luck, I keep getting the same error.
    – z123
    Jan 26, 2022 at 5:37
  • Also another thing I noticed is if I remove the heroku-postbuild then the build succeeds but ng build prod is never called so the frontend doesnt show
    – z123
    Jan 26, 2022 at 5:42
  • So what if you add --prod to build script? (I have edited my answer with and example) Jan 26, 2022 at 7:05
  • Tried that it still doesn’t work
    – z123
    Jan 26, 2022 at 7:06
0

I managed to solve the issue by changing the version of @angular/compiler-cli and @angular/compiler versions.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.