Skip to content

Instantly share code, notes, and snippets.

@2ajoyce
Created September 8, 2017 13:22
Show Gist options
  • Save 2ajoyce/2e80d61674c3da3ba1a87458ee96a076 to your computer and use it in GitHub Desktop.
Save 2ajoyce/2e80d61674c3da3ba1a87458ee96a076 to your computer and use it in GitHub Desktop.
/////////////////////////////////////////////////////////////////////////////////////////////////////////////
These instructions are based of the tutorial here:
https://medium.com/@ryanchenkie_40935/angular-cli-deployment-host-your-angular-2-app-on-heroku-3f266f13f352
They solve the aot issue that I encountered when following that tutorial.
/////////////////////////////////////////////////////////////////////////////////////////////////////////////
Create a new Angular 2 project using the cli.
Add the following lines to package.json under the scripts section.
"postinstall": "ng build --env=prod",
"start": "node server.js"
In the package.json move the following items from devDependancies to dependancies.
"@angular/cli"
"@angular/compiler-cli"
Add an engines section to the package.json. It should look similar to the following.
"engines": {
"node": "6.11.1",
"npm": "3.10.9"
}
Run the following command from the project root.
npm install --save express
Create a new file called server.js in the project root that contains the following text.
// server.js
const express = require('express');
const path = require('path');
const app = express();
// If an incoming request uses
// a protocol other than HTTPS,
// redirect that request to the
// same url but with HTTPS
const forceSSL = function() {
return function (req, res, next) {
if (req.headers['x-forwarded-proto'] !== 'https') {
return res.redirect(
['https://', req.get('Host'), req.url].join('')
);
}
next();
}
}
// Instruct the app
// to use the forceSSL
// middleware
app.use(forceSSL());
// Run the app by serving the static files
// in the dist directory
app.use(express.static(__dirname + '/dist'));
// Start the app by listening on the default
// Heroku port
app.listen(process.env.PORT || 8080);
// For all GET requests, send back index.html
// so that PathLocationStrategy can be used
app.get('/*', function(req, res) {
res.sendFile(path.join(__dirname + '/dist/index.html'));
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment