Production of Angular2 project

Question

This is my first angular2 project production. I used this answer from this site. 2.4.x FINAL (TypeScript) with Angular CLI 1.0.0-beta.24

OneTime Setup

npm install -g angular-cli

ng init from projectFolder if it is an existing application ng new projectFolder if it is an new application.

Bundling Steps

ng build --prod --aot (run in command line when directory is projectFolder) flag prod bundle for production and flag aot enable the ahead-of-time compilation also known as offline compilation.

bundles are generated by default to projectFolder/dist/

Output

dist/main.[hash].bundle.js Your application bundled [ size: 13 KB for new Angular CLI application empty, ~3 KB compressed].
dist/vendor.[hash].bundle.js Your dependencies (@angular, RxJS...) bundled [ size: 437 KB for new Angular CLI application empty, 98 KB compressed].
dist/index.html entry point of your application.
dist/inline.js webpack loader
dist/style.[hash].bundle.css the style definitions
dist/assetsresources copied from projectFolder/src/assets
dist/*.[hash].bundle.map the SourceMaps corresponding to the previous files (it is not required for a production deployment)

But when i click dist/index.html i receive only loading ... and nothing else. How Can i receive production version?

Answer 1

You can't open/bootstrap the Angular2 project by double-clicking on the index.html. You need a back-end (nodejs, lite-server) or a deployment server (hosting sites like hostinger or apache tomcat servers).

The official documentation is here.