Deploy Angular Universal to heroku, failed to compile Node.js app - node.js

I've been trying to deploy an Angular Universal app to heroku
No matter what I do the same error is returned
"failed to compile Node.js app."
I've set up a procfile, I've specified "engines"
(I've tried at the start and the end of the script),
I've moved some packages form devDependencies to dependencies in package.json (At one point putting all packages in to dependencies)
I've tried, committing my node folder.
I even used a completely different package.json And it still gives me exactly the same response!!?
Which tells me; I think, that it has nothing to do with dependancies, I'm using for this project?
using:
git add .
git commit -m"message"
git push heroku master
The response:
Compressing objects: 100% (252/252), done.
Writing objects: 100% (256/256), 3.20 MiB | 319.00 KiB/s, done.
Total 256 (delta 116), reused 0 (delta 0)
remote: Compressing source files... done.
remote: Building source:
remote:
remote: -----> Node.js app detected
remote:
remote: -----> Creating runtime environment
remote:
remote: NPM_CONFIG_LOGLEVEL=error
remote: NODE_VERBOSE=false
remote: NODE_ENV=production
remote: NODE_MODULES_CACHE=true
remote:
remote: -----> Installing binaries
remote: engines.node (package.json): unspecified
remote: engines.npm (package.json): unspecified (use default)
remote:
remote: Resolving node version 8.x...
remote: Downloading and installing node 8.11.2...
remote: Using default npm version: 5.6.0
remote:
remote: -----> Restoring cache
remote: Skipping cache restore (not-found)
remote:
remote: -----> Building dependencies
remote: Installing node modules (package.json + package-lock)
remote: npm ERR! Unexpected token < in JSON at position 108
remote:
remote: npm ERR! A complete log of this run can be found in:
remote: npm ERR! /tmp/npmcache.j8wgx/_logs/2018-05-21T14_34_17_856Z-debug.log
remote:
remote: -----> Build failed
remote:
remote: We're sorry this build is failing! You can troubleshoot common issues here:
remote: https://devcenter.heroku.com/articles/troubleshooting-node-deploys
remote:
remote: Some possible problems:
remote:
remote: - Node version not specified in package.json
remote: https://devcenter.heroku.com/articles/nodejs-support#specifying-a-node-js-version
remote:
remote: Love,
remote: Heroku
remote:
remote: ! Push rejected, failed to compile Node.js app.
remote:
remote: ! Push failed
remote: Verifying deploy...
remote:
remote: ! Push rejected to ma-leon.
remote:
To https://git.heroku.com/ma-leon.git
! [remote rejected] master -> master (pre-receive hook declined)
error: failed to push some refs to 'https://git.heroku.com/ma-leon.git'
My package.json:
{
"name": "maleon",
"version": "1.0.0",
"license": "MIT",
"main": "index.js",
"scripts": {
"ng": "ng",
"start": "node index.js",
"build:es2015": "node node_modules/babel-cli/bin/babel.js node_modules/ngx-page-scroll/ --out-dir node_modules/ngx-page-scroll/ --presets es2015",
"postinstall": "npm run build:es2015 && ng build --prod && ng build --prod --app 1 --output-hashing none",
"fix-scroll": "node node_modules/babel-cli/bin/babel.js node_modules/ngx-page-scroll/ --out-dir node_modules/ngx-page-scroll/ --presets es2015",
"lint": "tslint \"src/**/*.ts\" --project src/tsconfig.json --type-check && tslint \"e2e/**/*.ts\" --project e2e/tsconfig.json --type-check",
"test": "ng test",
"pree2e": "webdriver-manager update --standalone false --gecko false",
"e2e": "protractor"
},
"private": true,
"dependencies": {
"#angular/animations": "^5.2.0",
"#angular/common": "^5.2.10",
"#angular/compiler": "^5.2.0",
"#angular/core": "^5.2.10",
"#angular/forms": "^5.2.10",
"#angular/http": "^5.2.0",
"#angular/platform-browser": "^5.2.0",
"#angular/platform-browser-dynamic": "^5.2.0",
"#angular/platform-server": "^5.2.10",
"#angular/router": "^5.2.0",
"#nguniversal/express-engine": "^5.0.0",
"#nguniversal/module-map-ngfactory-loader": "^5.0.0",
"babel-cli": "^6.26.0",
"body-parser": "^1.17.1",
"bootstrap": "^3.3.7",
"core-js": "^2.5.3",
"express": "^4.15.2",
"emailjs": "^1.0.10",
"jquery": "^3.2.1",
"linkify": "^0.2.1",
"linkifyjs": "^2.1.6",
"ng2-bootstrap": "^1.6.3",
"ngx-page-scroll": "^4.0.2",
"rxjs": "^5.2.0",
"socket.io-client": "^1.7.3",
"ts-helpers": "^1.1.1",
"web-animations-js": "^2.2.5",
"zone.js": "0.8.5"
},
"devDependencies": {
"#angular/cli": "~1.7.4",
"#angular/compiler-cli": "^5.2.0",
"#angular/language-service": "^5.2.0",
"#types/jasmine": "~2.8.3",
"#types/jasminewd2": "~2.0.2",
"#types/node": "~6.0.60",
"babel-polyfill": "^6.26.0",
"babel-preset-es2015": "^6.24.1",
"codelyzer": "~2.0.0",
"jasmine-core": "~2.8.0",
"jasmine-spec-reporter": "~4.2.1",
"karma": "~2.0.0",
"karma-chrome-launcher": "~2.2.0",
"karma-coverage-istanbul-reporter": "^1.2.1",
"karma-jasmine": "~1.1.0",
"karma-jasmine-html-reporter": "^0.2.2",
"popper.js": "^1.14.3",
"protractor": "~5.1.2",
"request": "^2.81.0",
"smoothscroll-polyfill": "^0.4.0",
"ts-node": "~4.1.0",
"tslint": "~5.9.1",
"typescript": "~2.5.3"
},
"engines": {
"node": "9.x"
}
}

This is described in the common errors section of NPM's documentation:
Invalid JSON
Error: Invalid JSON
npm ERR! SyntaxError: Unexpected token <
npm ERR! registry error parsing json
Possible temporary npm registry glitch, or corrupted local server cache. Run npm cache clean and/or try again later.
This can be caused by corporate proxies that give HTML responses to package.json requests. Check npm's proxy configuration.
Check that it's not a problem with a package you're trying to install (e.g. invalid package.json).
Your package.json contains valid JSON. Try checking your package.lock.

In the end, this was to do with how I was pushing to heroku
Because I was on a branch, I should have been using:
git add .
git commit -m"message"
git push heroku <branchname:>master

Related

Heroku-postbuild error when deploying nodejs and angular to heroku

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
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"
},
I managed to solve the issue by changing the version of #angular/compiler-cli and #angular/compiler versions.

Heroku Deploy - “Push rejected, failed to compile Node.js app”

Trying to deploy a Laravel+vue application to heroku but when using git push heroku master I get the following trace (only part of the whole trace is shown but it is the part which I believe to be the problem - if not let me know):
remote: npm ERR! code EINTEGRITY
remote: npm ERR! sha512-
Prh/h9CB1jBCBIjSLD6kvIWhMV5S25Bwv7yK0fYJSOTIyg1CmU9OqNdRVCkdWyQY1Hkvm+1YdXJzh3xYupq1KA==
integrity checksum failed when using sha512: wanted sha512-
Prh/h9CB1jBCBIjSLD6kvIWhMV5S25Bwv7yK0fYJSOTIyg1CmU9OqNdRVCkdWyQY1Hkvm+1YdXJzh3xYupq1KA== but
got sha512-
QItiGZBy5TstGy+q8mjQTMGRlDDOARXLxH+sgVm1n/LYeo0zFcQlcCh8m4zi8QxctrxB9Kue/lStc/RD5iLadQ==.
(896052 bytes)
remote:
remote: npm ERR! A complete log of this run can be found in:
remote: npm ERR! /tmp/npmcache.8lpmC/_logs/2020-06-05T11_28_24_085Z-debug.log
remote:
remote: -----> Build failed
remote:
remote: We're sorry this build is failing! You can troubleshoot common issues here:
remote: https://devcenter.heroku.com/articles/troubleshooting-node-deploys
remote:
remote: Some possible problems:
remote:
remote: - Node version not specified in package.json
remote: https://devcenter.heroku.com/articles/nodejs-support#specifying-a-node-js-
version
remote:
remote: Love,
remote: Heroku
remote:
remote: ! Push rejected, failed to compile Node.js app.
remote:
remote: ! Push failed
remote: Verifying deploy...
remote:
and this my package.json
{
"private": true,
"scripts": {
"dev": "npm run development",
"development": "cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js",
"watch": "npm run development -- --watch",
"watch-poll": "npm run watch -- --watch-poll",
"hot": "cross-env NODE_ENV=development node_modules/webpack-dev-server/bin/webpack-dev-server.js --inline --hot --config=node_modules/laravel-mix/setup/webpack.config.js",
"prod": "npm run production",
"production": "cross-env NODE_ENV=production node_modules/webpack/bin/webpack.js --no-progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js",
"postinstall": "npm run prod",
"heroku-postbuild": "npm run prod"
},
"devDependencies": {
"axios": "^0.19",
"bootstrap": "^4.0.0",
"cross-env": "^5.1",
"jquery": "^3.5.1",
"laravel-mix": "^5.0.1",
"lodash": "^4.17.13",
"popper.js": "^1.12",
"resolve-url-loader": "^2.3.1",
"sass": "^1.20.1",
"sass-loader": "^8.0.0",
"vue": "^2.5.17",
"vue-template-compiler": "^2.6.10"
},
"dependencies": {
"#fullcalendar/core": "^4.4.0",
"#fullcalendar/daygrid": "^4.4.0",
"#fullcalendar/interaction": "^4.4.0",
"#fullcalendar/vue": "^4.4.0",
"#types/dhtmlxgantt": "^6.0.2",
"admin-lte": "^3.0.2",
"babel-runtime": "^6.26.0",
"bootstrap-vue": "^2.15.0",
"dhtmlx-gantt": "^6.3.7",
"laravel-echo": "^1.7.0",
"laravel-vue-pagination": "^2.3.1",
"mdbvue": "^6.7.0",
"moment": "^2.24.0",
"pusher-js": "^5.1.1",
"sweetalert2": "^9.8.2",
"vform": "^1.0.1",
"vue-full-calendar": "^2.7.0",
"vue-print-nb": "^1.5.0",
"vue-progressbar": "^0.7.5",
"vue-router": "^3.1.6",
"vuex": "^3.1.3"
},
"engines": {
"node": "12.x"
}
}
There's a bunch of error inside and I have no idea why this happen. but after many research i try many ways bu i didn't find the solution .So any help guys i'm stuck here since 2 days
Where you have specified the node version also specify the node version.
see if it works. It worked for me.
"engines": { "node": "12.x", "npm": "your version" }
Specifying the engines object-block helped me with both a Laravel app and a Rails app
package.json (append)
"engines": {
"node": "12.x"
}
Sort-of odd, but when it works, it works.
I also added a #dependabot rebase so that my preview builds using heroku would allow me to verify in-branch that this was the only problem preventing the applications from building.
Check your versions of node and npm in terminal:
node -v
npm -v
and update both in your package.json (example):
"engines": {
"node": "14.x",
"npm": "7.x"
}
just putting node version didn't help me since heroku automatically tried to build another version of npm and crashed
read more here:
https://devcenter.heroku.com/articles/deploying-nodejs#specify-the-version-of-node

Error while deploying Angular App (NodeJS) to Heroku

I currently develop an angular5 app, and need to deploy it to Heroku.
This app is served using NodeJS.
After logging into Heroku, I create new app by:
heroku create angular-vbnmc
and it was successful, now i could open https://angular-vbnmc.herokuapp.com/ without problems, but still the content is blank, see picture below:
Then i deploy my app with following commands
git push heroku newFeatureBranch:master
Note: I didn't push my master branch but instead i push newFeatureBranch to remote heroku's master branch
and I got following error
Counting objects: 219, done.
Delta compression using up to 4 threads.
Compressing objects: 100% (208/208), done.
Writing objects: 100% (219/219), 122.63 KiB | 3.50 MiB/s, done.
Total 219 (delta 111), reused 0 (delta 0)
remote: Compressing source files... done.
remote: Building source:
remote:
remote: -----> Node.js app detected
remote:
remote: -----> Creating runtime environment
remote:
remote: NPM_CONFIG_LOGLEVEL=error
remote: NODE_VERBOSE=false
remote: NODE_ENV=production
remote: NODE_MODULES_CACHE=true
remote:
remote: -----> Installing binaries
remote: engines.node (package.json): 8.9.4
remote: engines.npm (package.json): 5.6.0
remote:
remote: Resolving node version 8.9.4...
remote: Downloading and installing node 8.9.4...
remote: npm 5.6.0 already installed with node
remote:
remote: -----> Restoring cache
remote: Skipping cache restore (not-found)
remote:
remote: -----> Building dependencies
remote: Prebuild detected (node_modules already exists)
remote: Rebuilding any native modules
remote: bootstrap#4.0.0 /tmp/build_61c2abaea4d9525f4aeb3f08e81769a2/node_modules/bootstrap
remote: Installing any new modules (package.json)
remote:
remote: > uws#0.14.5 install /tmp/build_61c2abaea4d9525f4aeb3f08e81769a2/node_modules/uws
remote: > node-gyp rebuild > build_log.txt 2>&1 || exit 0
remote:
remote:
remote: > node-sass#4.7.2 install /tmp/build_61c2abaea4d9525f4aeb3f08e81769a2/node_modules/node-sass
remote: > node scripts/install.js
remote:
remote: Downloading binary from https://github.com/sass/node-sass/releases/download/v4.7.2/linux-x64-57_binding.node
remote: Download complete
remote: Binary saved to /tmp/build_61c2abaea4d9525f4aeb3f08e81769a2/node_modules/node-sass/vendor/linux-x64-57/binding.node
remote: Caching binary to /tmp/npmcache.ShxWb/node-sass/4.7.2/linux-x64-57_binding.node
remote:
remote: > uglifyjs-webpack-plugin#0.4.6 postinstall /tmp/build_61c2abaea4d9525f4aeb3f08e81769a2/node_modules/webpack/node_modules/uglifyjs-webpack-plugin
remote: > node lib/post_install.js
remote:
remote:
remote: > node-sass#4.7.2 postinstall /tmp/build_61c2abaea4d9525f4aeb3f08e81769a2/node_modules/node-sass
remote: > node scripts/build.js
remote:
remote: Binary found at /tmp/build_61c2abaea4d9525f4aeb3f08e81769a2/node_modules/node-sass/vendor/linux-x64-57/binding.node
remote: Testing binary
remote: Binary is fine
remote:
remote: > angular-vbnmc#0.0.0 postinstall /tmp/build_61c2abaea4d9525f4aeb3f08e81769a2
remote: > ng build --prod
remote:
remote:
remote: An error occured during the build:
remote: Error: ENOENT: no such file or directory, open '/tmp/build_61c2abaea4d9525f4aeb3f08e81769a2/node_modules/bootstrap/dist/js/bootstrap.min.js'
remote: ENOENT: no such file or directory, open '/tmp/build_61c2abaea4d9525f4aeb3f08e81769a2/node_modules/bootstrap/dist/js/bootstrap.min.js'
remote: Error: ENOENT: no such file or directory, open '/tmp/build_61c2abaea4d9525f4aeb3f08e81769a2/node_modules/bootstrap/dist/js/bootstrap.min.js'
remote: npm ERR! code ELIFECYCLE
remote: npm ERR! errno 1
remote: npm ERR! angular-vbnmc#0.0.0 postinstall: `ng build --prod`
remote: npm ERR! Exit status 1
remote: npm ERR!
remote: npm ERR! Failed at the angular-vbnmc#0.0.0 postinstall script.
remote: npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
remote:
remote: npm ERR! A complete log of this run can be found in:
remote: npm ERR! /tmp/npmcache.ShxWb/_logs/2018-03-06T04_54_08_334Z-debug.log
remote:
remote: -----> Build failed
remote:
remote: We're sorry this build is failing! You can troubleshoot common issues here:
remote: https://devcenter.heroku.com/articles/troubleshooting-node-deploys
remote:
remote: Some possible problems:
remote:
remote: - node_modules checked into source control
remote: https://blog.heroku.com/node-habits-2016#9-only-git-the-important-bits
remote:
remote: Love,
remote: Heroku
remote:
remote: ! Push rejected, failed to compile Node.js app.
remote:
remote: ! Push failed
remote: Verifying deploy...
remote:
remote: ! Push rejected to angular-vbnmc.
remote:
To https://git.heroku.com/angular-vbnmc.git
! [remote rejected] 12-Deployment -> master (pre-receive hook declined)
error: failed to push some refs to 'https://git.heroku.com/angular-vbnmc.git'
For additional information, here is my package.json:
{
"name": "angular-vbnmc",
"version": "0.0.0",
"license": "MIT",
"scripts": {
"ng": "ng",
"start": "node server.js",
"build": "ng build --prod",
"test": "ng test",
"lint": "ng lint",
"e2e": "ng e2e",
"postinstall": "ng build --prod"
},
"private": true,
"dependencies": {
"#angular/animations": "^5.2.7",
"#angular/cli": "1.6.6",
"#angular/common": "^5.2.7",
"#angular/compiler": "^5.2.7",
"#angular/compiler-cli": "^5.2.7",
"#angular/core": "^5.2.7",
"#angular/forms": "^5.2.7",
"#angular/http": "^5.2.7",
"#angular/platform-browser": "^5.2.7",
"#angular/platform-browser-dynamic": "^5.2.7",
"#angular/router": "^5.2.7",
"bootstrap": "^4.0.0",
"core-js": "^2.4.1",
"express": "^4.16.2",
"jquery": "^3.3.1",
"popper.js": "^1.13.0",
"rxjs": "^5.5.6",
"typescript": "^2.6.2",
"zone.js": "^0.8.19"
},
"devDependencies": {
"#angular/language-service": "^5.2.7",
"#types/jasmine": "~2.8.3",
"#types/jasminewd2": "~2.0.2",
"#types/node": "^6.0.101",
"codelyzer": "^4.2.1",
"jasmine-core": "~2.8.0",
"jasmine-spec-reporter": "~4.2.1",
"karma": "~2.0.0",
"karma-chrome-launcher": "~2.2.0",
"karma-coverage-istanbul-reporter": "^1.2.1",
"karma-jasmine": "~1.1.0",
"karma-jasmine-html-reporter": "^0.2.2",
"protractor": "~5.1.2",
"ts-node": "~4.1.0",
"tslint": "5.8.0"
},
"engines": {
"node": "8.9.4",
"npm": "5.6.0"
}
}
Why is this happening? and how to fix this error?

Heruku Deploy Error Angular

I am getting this error while I upload ng project. When I am localy it works fines. When I upload it to Heruku I get this error.
-----> Node.js app detected
-----> Creating runtime environment
NPM_CONFIG_LOGLEVEL=error
NPM_CONFIG_PRODUCTION=true
NODE_VERBOSE=false
NODE_ENV=production
NODE_MODULES_CACHE=true
-----> Installing binaries
engines.node (package.json): 8.1.4
engines.npm (package.json): unspecified (use default)
Resolving node version 8.1.4...
Downloading and installing node 8.1.4...
Detected package-lock.json: defaulting npm to version 5.x.x
Bootstrapping npm 5.x.x (replacing 5.0.3)...
npm 5.3.0 installed
-----> Restoring cache
Skipping cache restore (not-found)
-----> Building dependencies
Installing node modules (package.json + package-lock)
> orahi-dash-board#0.0.0 preinstall /tmp/build_69fc13367426455c989d318ff32b98f2
> npm install -g http-server
/tmp/build_69fc13367426455c989d318ff32b98f2/.heroku/node/bin/http-server -> /tmp/build_69fc13367426455c989d318ff32b98f2/.heroku/node/lib/node_modules/http-server/bin/http-server
/tmp/build_69fc13367426455c989d318ff32b98f2/.heroku/node/bin/hs -> /tmp/build_69fc13367426455c989d318ff32b98f2/.heroku/node/lib/node_modules/http-server/bin/http-server
+ http-server#0.10.0
added 23 packages in 2.902s
> orahi-dash-board#0.0.0 postinstall /tmp/build_69fc13367426455c989d318ff32b98f2
> ng build --aot -prod
sh: 1: ng: not found
npm ERR! file sh
npm ERR! code ELIFECYCLE
npm ERR! errno ENOENT
npm ERR! syscall spawn
npm ERR! orahi-dash-board#0.0.0 postinstall: `ng build --aot -prod`
npm ERR! spawn ENOENT
npm ERR!
npm ERR! Failed at the orahi-dash-board#0.0.0 postinstall 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! /app/.npm/_logs/2017-08-02T03_59_17_505Z-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
What might be the issue?
Here is my package.json
{
"name": "",
"version": "0.0.0",
"license": "MIT",
"engines": {
"node": "8.1.4"
},
"angular-cli": {},
"scripts": {
"ng": "ng",
"start": "http-server",
"lint": "tslint \"src/**/ *.ts\"",
"test": "ng test",
"pree2e": "webdriver-manager update",
"e2e": "protractor",
"preinstall": "npm install -g http-server",
"postinstall": "ng build --aot -prod",
"start-dev": "ng serve"
},
"private": true,
"dependencies": {
"#angular/animations": "^4.3.2",
"#angular/common": "^4.3.2",
"#angular/compiler": "^4.3.2",
"#angular/compiler-cli": "^4.3.2",
"#angular/core": "^4.3.2",
"#angular/forms": "^4.3.2",
"#angular/http": "^4.3.2",
"#angular/material": "2.0.0-beta.2",
"#angular/platform-browser": "^4.3.2",
"#angular/platform-browser-dynamic": "^4.3.2",
"#angular/platform-server": "^4.3.2",
"#angular/router": "^4.3.2",
"#angular/tsc-wrapped": "^0.5.0",
"#ngrx/core": "^1.2.0",
"#ngrx/store": "^2.2.2",
"angular2-datatable": "0.6.0",
"angular2-google-maps": "0.17.0",
"core-js": "2.4.1",
"express": "^4.15.3",
"hammerjs": "^2.0.8",
"install": "^0.10.1",
"ng2-img-cropper": "0.8.0",
"npm": "^5.0.3",
"rxjs": "^5.4.2",
"typescript": "^2.4.2",
"zone.js": "0.7.6"
},
"devDependencies": {
"#angular/cli": "^1.2.6",
"#types/hammerjs": "^2.0.34",
"#types/jasmine": "2.5.38",
"#types/node": "6.0.60",
"codelyzer": "2.0.0-beta.4",
"jasmine-core": "2.5.2",
"jasmine-spec-reporter": "3.2.0",
"karma": "1.4.1",
"karma-chrome-launcher": "2.0.0",
"karma-cli": "1.0.1",
"karma-coverage-istanbul-reporter": "0.2.0",
"karma-jasmine": "1.1.0",
"karma-jasmine-html-reporter": "0.2.2",
"ngrx-store-freeze": "^0.1.9",
"protractor": "5.1.0",
"ts-node": "2.0.0",
"tslint": "4.4.2"
}
}
Angular dependencies are added to your devDependencies by default. Heroku doesn't install dev dependencies when deploying, so those dependencies need to be moved into the regular dependencies section of your package.json. See 'Move the #angular/cli Dependency' on this guide: https://medium.com/#ryanchenkie_40935/angular-cli-deployment-host-your-angular-2-app-on-heroku-3f266f13f352

Deploy ng-2 admin Angular 2 to heroku

I'm trying to deploy my project based on ng2-admin .the Build succeeded but whe i launch heroku open to run the project i got :
Application error An error occurred in the application and your page
could not be served. If you are the application owner, check your logs
for details.
Here is the logs:
remote: Compressing source files... done.
remote: Building source:
remote:
remote: -----> Node.js app detected
remote:
remote: -----> Creating runtime environment
remote:
remote: NPM_CONFIG_LOGLEVEL=error
remote: NPM_CONFIG_PRODUCTION=true
remote: NODE_VERBOSE=false
remote: NODE_ENV=production
remote: NODE_MODULES_CACHE=true
remote:
remote: -----> Installing binaries
remote: engines.node (package.json): unspecified
remote: engines.npm (package.json): unspecified (use default)
remote: engines.yarn (package.json): unspecified (use default)
remote:
remote: Resolving node version 6.x via semver.io...
remote: Downloading and installing node 6.11.0...
remote: Using default npm version: 3.10.10
remote: Resolving yarn version (latest) via semver.io...
remote: Downloading and installing yarn (0.24.5)...
remote: Installed yarn 0.24.5
remote:
remote: -----> Restoring cache
remote: Skipping cache restore (new-signature)
remote:
remote: -----> Building dependencies
remote: Installing node modules (yarn.lock)
remote: yarn install v0.24.5
remote: [1/4] Resolving packages...
remote: [2/4] Fetching packages...
remote: warning fsevents#1.1.1: The platform "linux" is incompatible with this module.
remote: info "fsevents#1.1.1" is an optional dependency and failed compatibility check. Excluding it from installation.
remote: [3/4] Linking dependencies...
remote: warning "angular2-datatable#0.6.0" has incorrect peer dependency "#angular/core#^2.0.0".
remote: warning "angular2-datatable#0.6.0" has incorrect peer dependency "#angular/common#^2.0.0".
remote: warning "angular2-datatable#0.6.0" has incorrect peer dependency "#angular/platform-browser#^2.0.0".
remote: warning "ng2-ckeditor#1.1.6" has incorrect peer dependency "#angular/core#^2.1.0".
remote: warning "ng2-ckeditor#1.1.6" has incorrect peer dependency "#angular/forms#^2.1.0".
remote: warning "ng2-ckeditor#1.1.6" has incorrect peer dependency "#angular/common#^2.1.0".
remote: warning "ng2-handsontable#0.48.0" has incorrect peer dependency "#angular/common#^2.3.1".
remote: warning "ng2-handsontable#0.48.0" has incorrect peer dependency "#angular/compiler#^2.3.1".
remote: warning "ng2-handsontable#0.48.0" has incorrect peer dependency "#angular/core#^2.3.1".
remote: warning "ng2-handsontable#0.48.0" has incorrect peer dependency "#angular/forms#^2.3.1".
remote: [4/4] Building fresh packages...
remote: Done in 47.14s.
remote:
remote: -----> Caching build
remote: Clearing previous node cache
remote: Saving 2 cacheDirectories (default):
remote: - node_modules
remote: - bower_components (nothing to cache)
remote:
remote: -----> Build succeeded!
remote: -----> Discovering process types
remote: Procfile declares types -> (none)
remote: Default types for buildpack -> web
remote:
remote: -----> Compressing...
remote: Done: 60.3M
remote: -----> Launching...
remote: Released v3
remote: https://testngadmin.herokuapp.com/ deployed to Heroku
remote:
remote: Verifying deploy... done.
To https://git.heroku.com/testngadmin.git
My package.json:
{
"name": "ng2-admin",
"version": "1.0.0",
"description": "Angular and Bootstrap 4 Admin Template.",
"author": "Akveo <contact#akveo.com>",
"homepage": "http://akveo.github.io/ng2-admin/",
"repository": {
"type": "git",
"url": "https://github.com/akveo/ng2-admin.git"
},
"bugs": {
"url": "https://github.com/akveo/ng2-admin/issues"
},
"license": "MIT",
"scripts": {
"ng": "ng",
"rimraf": "rimraf",
"changelog": "standard-changelog",
"start": "ng serve",
"start:hmr": "ng serve --hmr",
"start:aot": "ng serve --aot",
"start:prod": "ng serve --prod",
"start:prod:aot": "ng serve --prod --aot",
"build": "npm run clean:dist && ng build",
"build:prod": "npm run build -- --prod",
"build:prod:aot": "npm run build:prod -- --aot",
"build:ci": "npm run build:prod && npm run build:prod:aot",
"build:demo": "npm run build:prod:aot -- --base-href \"http://akveo.com/ng2-admin/\"",
"test": "ng test -sr",
"test:coverage": "npm run clean:coverage && ng test -sr -cc",
"lint": "ng lint",
"lint:styles": "stylelint ./src/app/**/*.scss",
"lint:ci": "npm run lint && npm run lint:styles",
"pree2e": "webdriver-manager update --standalone false --gecko false",
"e2e": "ng e2e",
"clean:dist": "npm run rimraf -- dist",
"clean:coverage": "npm run rimraf -- coverage",
"docs:deploy": "wintersmith build -C docs && gh-pages -d docs/build",
"docs:serve": "wintersmith preview -C docs"
},
"private": true,
"dependencies": {
"#angular/animations": "4.1.3",
"#angular/common": "4.1.3",
"#angular/compiler": "4.1.3",
"#angular/core": "4.1.3",
"#angular/forms": "4.1.3",
"#angular/http": "4.1.3",
"#angular/platform-browser": "4.1.3",
"#angular/platform-browser-dynamic": "4.1.3",
"#angular/platform-server": "4.1.3",
"#angular/router": "4.1.3",
"#ng-bootstrap/ng-bootstrap": "1.0.0-alpha.26",
"#ngx-translate/core": "6.0.1",
"#ngx-translate/http-loader": "0.0.3",
"amcharts3": "3.21.2",
"ammap": "^3.20.7",
"angular2-datatable": "0.6.0",
"animate.css": "3.5.2",
"bootstrap": "4.0.0-alpha.6",
"chart.js": "1.1.1",
"chartist": "0.10.1",
"chroma-js": "1.3.3",
"ckeditor": "4.6.2",
"core-js": "2.4.1",
"easy-pie-chart": "2.1.7",
"font-awesome": "4.7.0",
"fullcalendar": "3.3.1",
"google-maps": "3.2.1",
"ionicons": "2.0.1",
"jquery": "3.2.1",
"jquery-slimscroll": "1.3.8",
"leaflet": "0.7.7",
"leaflet-map": "0.2.1",
"lodash": "4.17.4",
"ng2-ckeditor": "1.1.6",
"ng2-completer": "1.3.1",
"ng2-handsontable": "0.48.0",
"ng2-slim-loading-bar": "4.0.0",
"ng2-smart-table": "1.0.3",
"ng2-tree": "2.0.0-alpha.5",
"ngx-uploader": "2.2.5",
"normalize.css": "6.0.0",
"roboto-fontface": "0.7.0",
"rxjs": "5.4.0",
"zone.js": "0.8.11"
},
"devDependencies": {
"#angular/cli": "1.0.4",
"#angular/compiler-cli": "4.1.3",
"#types/fullcalendar": "2.7.40",
"#types/jasmine": "2.5.38",
"#types/jquery": "2.0.41",
"#types/jquery.slimscroll": "1.3.30",
"#types/lodash": "4.14.61",
"#types/node": "6.0.69",
"codelyzer": "3.0.1",
"gh-pages": "0.12.0",
"jasmine-core": "2.5.2",
"jasmine-spec-reporter": "3.2.0",
"karma": "1.4.1",
"karma-chrome-launcher": "2.0.0",
"karma-cli": "1.0.1",
"karma-coverage-istanbul-reporter": "0.2.0",
"karma-jasmine": "1.1.0",
"karma-jasmine-html-reporter": "0.2.2",
"npm-run-all": "4.0.2",
"protractor": "5.1.0",
"rimraf": "2.6.1",
"standard-changelog": "1.0.1",
"stylelint": "7.10.1",
"ts-node": "2.1.2",
"tslint": "5.2.0",
"tslint-eslint-rules": "4.0.0",
"tslint-language-service": "0.9.6",
"typescript": "2.3.2",
"typogr": "0.6.6",
"underscore": "1.8.3",
"wintersmith": "2.2.5",
"wintersmith-sassy": "1.1.0"
}
}
i solve the problem,
delete /dist from .gitignore
run the project localy in production with npm run build:prod to
generate a /dist folder
modify package.json file by adding
"engines": {
"node": "6.9.1",
"npm": "3.10.8"
}
and
"start": "http-server dist/",
"preinstall": "npm install -g http-server"
in scripts
have you tried adding the following line to the scripts section?
"postinstall": "ng build --aot -prod"
I think that you also need to move:
"#angular/cli": "1.0.4",
"#angular/compiler-cli": "4.1.3",
to the dependencies section for this to work.
Hope it helps.

Resources