Shawon Amos

  1.Check Node and Npm version 2.Create Angular App 3.Run app(ng serve) 4.Add "heroku-postbuild": "ng build --prod" and "start": "node server.js"  in scripts in package.json 5. Add  "engines": {    "node": "local machine version",    "npm": "local machine version"  } in package.json 6.Take devDependencies(@angular/cli,@angular/compiler-cli,typescript) to dependencies  in package.json 7.install express server. npm install express path --save 8.Create server.js file in root directory and put this . const express = require('express'); const path = require('path'); const app = express(); app.use(express.static('./dist/appname')); app.get('/*', (req, res) =>     res.sendFile('index.html', {root: 'dist/appname/'}), ); app.listen(process.env.PORT || 8080); 9. add "start": "node server.js" in scripts in in package.json 10.init git repo...

Making use of the Angular CLI, setup a new project by running : ng new demo-deploy cd demo-deploy ng serve git remote add origin <new_github_repository_url> git add . git commit -m "initial commit" git push -u origin master Setup Automatic Deployment from GitHub     to Heroku: Go to   heroku website . Its free.  Login  to your dashboard and create a new app. Click  Create app Two more simple steps: 1.Under Automatic Deploys, select the master branch and click Enable Automatic Deploys. 2. Under Manual Deploys, click Deploy Branch. This is to push our fresh code to heroku. It might take a little while but will show you successfully deployed message once done. Configure Your Angular App to Deploy Properly on Heroku: Install them into your application by running this commands in your terminal: npm install @angular/cli@latest @angular/compiler-cli --save-dev Create pos...

Okay, I can't remember if it was me who changed that or whether this is set per default but in  angular.json  there is also a way to set the output directory ( outputPath ). For some reason this was set to "outputPath": "dist/<project-name>" I changed that to "outputPath": "dist" and now everything works