This article on Deploying an Angular App is part of the Learning Angular series.
Deployment Preparations and Important Steps
Steps:
a) Build the app for production. Better to consider AIT or whatevr method we follow.
ng build --prod --aot
b) Set the correct element
If Angular is being served form any folder that is not the root of the server, then the base href needs to be set to that folder.
For an Angular app that is hosted on www.xyz.com/myapp, then we should set in the index.html file
or add it in the build script like
ng build --prod --base-href=/myapp/
c) Need to make sure that the server always return index.html on 404 error.
Whenever we hit an url in the browser, the server is the first to parse the url. So if we are hitting a router directly, then the server won’t be able to find it as that is registerd in the Angular product. So the server would redirect to a 404. So the server setting should be such that the 404 gets redirected to index.htmnl which holds the information about all the routes. This would make sure that the redirection information reaches Angular and it redirects the user to the particular route inside that of the Angular App.