I am trying to deplpy an angular app to heroku, and in the error
ERROR in src/app/components/user-sidebar/sidebar.component.html(31,66): : Property 'isAdmin' does not exist on type 'SidebarComponent'.
But isAdmin isn't supposed to be a field on the SidebarComponent. It used to be, when I first wrote it, but then I refactored and removed it. In fact, in the github repo my app which heroku is pulling from, I never committed that version of the code, so I don't know why it's complaining about that field being missing.
I have previously deployed apps to heroku before. Here is the full build log and some of my files:
FYI, the engines in package.json are correct. Those are the versions of npm and node I have installed on my machine.
Heroku Build Logs
-----> Node.js app detected
-----> Creating runtime environment
NPM_CONFIG_LOGLEVEL=error
NODE_ENV=production
NODE_MODULES_CACHE=true
NODE_VERBOSE=false
-----> Installing binaries
engines.node (package.json): 10.16.0
engines.npm (package.json): 6.9.0
Resolving node version 10.16.0...
Downloading and installing node 10.16.0...
npm 6.9.0 already installed with node
-----> Installing dependencies
Installing node modules (package.json + package-lock)
> [email protected] preinstall /tmp/build_dfa881318ac3ca0a1cb6d9eb58e6e0d6
> npm install -g @angular/cli
/tmp/build_dfa881318ac3ca0a1cb6d9eb58e6e0d6/.heroku/node/bin/ng -> /tmp/build_dfa881318ac3ca0a1cb6d9eb58e6e0d6/.heroku/node/lib/node_modules/@angular/cli/bin/ng
> @angular/[email protected] postinstall /tmp/build_dfa881318ac3ca0a1cb6d9eb58e6e0d6/.heroku/node/lib/node_modules/@angular/cli
> node ./bin/postinstall/script.js
+ @angular/[email protected]
added 239 packages from 185 contributors in 11.552s
> [email protected] postinstall /tmp/build_dfa881318ac3ca0a1cb6d9eb58e6e0d6/node_modules/babel-runtime/node_modules/core-js
> node scripts/postinstall || echo "ignore"
> [email protected] postinstall /tmp/build_dfa881318ac3ca0a1cb6d9eb58e6e0d6/node_modules/karma/node_modules/core-js
> node scripts/postinstall || echo "ignore"
> @angular/[email protected] postinstall /tmp/build_dfa881318ac3ca0a1cb6d9eb58e6e0d6/node_modules/@angular/cli
> node ./bin/postinstall/script.js
> [email protected] postinstall /tmp/build_dfa881318ac3ca0a1cb6d9eb58e6e0d6/node_modules/chartist
> [email protected] postinstall /tmp/build_dfa881318ac3ca0a1cb6d9eb58e6e0d6/node_modules/core-js
> node scripts/postinstall || echo "ignore"
> [email protected] postinstall /tmp/build_dfa881318ac3ca0a1cb6d9eb58e6e0d6
> ng build --aot --prod
Date: 2019-07-20T02:50:34.441Z
Hash: cd983ec987dacf80900e
Time: 42210ms
chunk {0} runtime.741402d1d47331ce975c.js (runtime) 1.41 kB [entry] [rendered]
chunk {1} main.4af9b61479361f268d39.js (main) 128 bytes [initial] [rendered]
chunk {2} polyfills.d64fff5b0a45205ed7b5.js (polyfills) 130 bytes [initial] [rendered]
chunk {3} polyfills-es5.613d1909ec381c0aefb7.js (polyfills-es5) 68 kB [initial] [rendered]
chunk {4} styles.02d35618b7ff5627c133.css (styles) 583 kB [initial] [rendered]
chunk {scripts} scripts.23c891176a6fdb868027.js (scripts) 304 kB [entry] [rendered]
ERROR in src/app/components/user-sidebar/sidebar.component.html(31,66): : Property 'isAdmin' does not exist on type 'SidebarComponent'.
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! [email protected] postinstall: `ng build --aot --prod`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the [email protected] 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! /tmp/npmcache.ZUiIp/_logs/2019-07-20T02_50_34_594Z-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
Build finished
heroku.com
Blogs
Careers
Documentation
Support
Terms of Service
Privacy
Cookies
package.json
{
"name": "kroe761-app",
"version": "2.3.0",
"license": "MIT",
"scripts": {
"ng": "ng",
"start": "node server.js",
"build": "ng build --prod",
"test": "ng test",
"lint": "ng lint",
"e2e": "ng e2e",
"install:clean": "rm -rf node_modules/ && rm -rf package-lock.json && npm install && ng serve -o",
"preinstall": "npm install -g @angular/cli",
"postinstall": "ng build --aot --prod"
},
"engines": {
"node": "10.16.0",
"npm": "6.9.0"
},
"private": true,
"dependencies": {
"@agm/core": "1.0.0-beta.6",
"@angular/animations": "8.0.0",
"@angular/cdk": "8.0.1",
"@angular/common": "8.0.0",
"@angular/compiler": "8.0.0",
"@angular/core": "8.0.0",
"@angular/forms": "8.0.0",
"@angular/material": "8.0.1",
"@angular/platform-browser": "8.0.0",
"@angular/platform-browser-dynamic": "8.0.0",
"@angular/platform-server": "8.0.0",
"@angular/router": "8.0.0",
"ajv": "6.10.0",
"arrive": "2.4.1",
"bootstrap": "4.3.1",
"bootstrap-material-design": "4.1.2",
"bootstrap-notify": "3.1.3",
"chartist": "0.11.2",
"classlist.js": "1.1.20150312",
"core-js": "3.1.3",
"express": "4.17.1",
"googleapis": "40.0.0",
"hammerjs": "2.0.8",
"jquery": "3.4.1",
"moment": "2.24.0",
"perfect-scrollbar": "1.1.0",
"popper.js": "1.15.0",
"rxjs": "6.5.2",
"rxjs-compat": "6.5.2",
"web-animations-js": "2.3.1",
"zone.js": "0.9.1"
},
"devDependencies": {
"@angular-devkit/build-angular": "0.800.2",
"@angular/cli": "8.0.3",
"@angular/compiler-cli": "8.0.0",
"@angular/language-service": "8.0.0",
"@types/bootstrap": "4.3.0",
"@types/chartist": "0.9.46",
"@types/googlemaps": "3.36.4",
"@types/jasmine": "3.3.13",
"@types/jquery": "3.3.29",
"@types/node": "12.0.7",
"codelyzer": "5.1.0",
"jasmine-core": "3.4.0",
"jasmine-spec-reporter": "4.2.1",
"karma": "4.1.0",
"karma-chrome-launcher": "2.2.0",
"karma-cli": "2.0.0",
"karma-coverage-istanbul-reporter": "2.0.5",
"karma-jasmine": "2.0.1",
"karma-jasmine-html-reporter": "1.4.2",
"protractor": "5.4.2",
"ts-node": "8.2.0",
"tslint": "5.17.0",
"typescript": "3.4.5"
}
}
angular.json
{
"$schema": "./node_modules/@angular/cli/lib/config/schema.json",
"version": 1,
"newProjectRoot": "projects",
"projects": {
"kroe761-app": {
"root": "",
"sourceRoot": "src",
"projectType": "application",
"architect": {
"build": {
"builder": "@angular-devkit/build-angular:browser",
"options": {
"outputPath": "dist/kroe761-app",
"index": "src/index.html",
"main": "src/main.ts",
"tsConfig": "src/tsconfig.app.json",
"polyfills": "src/polyfills.ts",
"assets": [
"src/assets",
"src/favicon.ico"
],
"styles": [
"node_modules/perfect-scrollbar/css/perfect-scrollbar.css",
"src/assets/scss/material-dashboard.scss",
"src/assets/css/demo.css"
],
"scripts": [
"node_modules/jquery/dist/jquery.js",
"node_modules/popper.js/dist/umd/popper.js",
"node_modules/bootstrap-material-design/dist/js/bootstrap-material-design.min.js",
"node_modules/arrive/src/arrive.js",
"node_modules/moment/moment.js",
"node_modules/perfect-scrollbar/dist/perfect-scrollbar.min.js",
"node_modules/bootstrap-notify/bootstrap-notify.js",
"node_modules/chartist/dist/chartist.js"
]
},
"configurations": {
"production": {
"optimization": true,
"outputHashing": "all",
"sourceMap": false,
"extractCss": true,
"namedChunks": false,
"aot": true,
"extractLicenses": true,
"vendorChunk": false,
"buildOptimizer": true,
"fileReplacements": [
{
"replace": "src/environments/environment.ts",
"with": "src/environments/environment.prod.ts"
}
]
}
}
},
"serve": {
"builder": "@angular-devkit/build-angular:dev-server",
"options": {
"browserTarget": "kroe761-app:build"
},
"configurations": {
"production": {
"browserTarget": "kroe761-app:build:production"
}
}
},
"extract-i18n": {
"builder": "@angular-devkit/build-angular:extract-i18n",
"options": {
"browserTarget": "kroe761-app:build"
}
},
"test": {
"builder": "@angular-devkit/build-angular:karma",
"options": {
"main": "src/test.ts",
"karmaConfig": "./karma.conf.js",
"polyfills": "src/polyfills.ts",
"tsConfig": "src/tsconfig.spec.json",
"scripts": [
"node_modules/jquery/dist/jquery.js",
"node_modules/popper.js/dist/umd/popper.js",
"node_modules/bootstrap-material-design/dist/js/bootstrap-material-design.min.js",
"node_modules/arrive/src/arrive.js",
"node_modules/moment/moment.js",
"node_modules/perfect-scrollbar/dist/perfect-scrollbar.min.js",
"node_modules/bootstrap-notify/bootstrap-notify.js",
"node_modules/chartist/dist/chartist.js"
],
"styles": [
"node_modules/perfect-scrollbar/css/perfect-scrollbar.css",
"src/assets/scss/material-dashboard.scss",
"src/assets/css/demo.css"
],
"assets": [
"src/assets",
"src/favicon.ico"
]
}
},
"lint": {
"builder": "@angular-devkit/build-angular:tslint",
"options": {
"tsConfig": [
"src/tsconfig.app.json",
"src/tsconfig.spec.json"
],
"exclude": []
}
}
}
},
"kroe761-app-e2e": {
"root": "",
"sourceRoot": "",
"projectType": "application",
"architect": {
"e2e": {
"builder": "@angular-devkit/build-angular:protractor",
"options": {
"protractorConfig": "./protractor.conf.js",
"devServerTarget": "kroe761-app:serve"
}
},
"lint": {
"builder": "@angular-devkit/build-angular:tslint",
"options": {
"tsConfig": [
"e2e/tsconfig.e2e.json"
],
"exclude": []
}
}
}
}
},
"defaultProject": "kroe761-app",
"schematics": {
"@schematics/angular:component": {
"prefix": "app",
"styleext": "scss"
},
"@schematics/angular:directive": {
"prefix": "app"
}
}
}
server.js
const express = require('express');
const app = express();
const path = require('path');
app.use(express.static(__dirname + '/dist/kroe761-app'));
app.listen(process.env.PORT || 8080);
app.get('/*', function (req, res) {
res.sendFile(path.join(__dirname + '/dist/kroe761-app/index.html'));
});
Well.....I'm an idiot. I'll keep this up in case someone else can learn from my stupidity. I left a reference to isAdmin in the sidebar template as *ngIf="!isAdmin". Because it was false VS Code Intellisense didn't flag it.
Whoops.
Collected from the Internet
Please contact [email protected] to delete if infringement.
Comments