Deploy Angular App On Heroku

1/ Install node modules

npm install @angular/cli@latest @angular/compiler-cli --save-dev
npm install express -s

2/ Update angular.json

"outputPath": "dist"

3/ Add server.js to root

//Install express server
const express = require('express');
const path = require('path');

const app = express();

// Serve only the static files form the dist directory
app.use(express.static(__dirname + '/dist'));

app.get('/*', function (req, res) {
    res.sendFile(path.join(__dirname + '/dist/index.html'));
});

// Start the app by listening on the default Heroku port
app.listen(process.env.PORT || 8080);

4/ Update package.json

add to root

	"engines": {
		"node": "14.x",
		"npm": "6.x"
	  }

add under “scripts”

	"heroku-postbuild": "ng build --prod"
	"start": "node server.js"

5/ Deploy on Heroku

• create a new app connected to your Github
• manual deploy: choose your branch to deploy