-
Bundle Steps
Inside the project folder:
ng build --configuration production --aot
This also performs AoT compilation for even smaller bundles (no Angular compiler, instead, generated compiler output). The bundles are much smaller with AoT if you use Angular 4 as the generated code is smaller.
You can test your app with AoT in development mode (source maps, no minification) and AoT by runningng build --aot
.Output
The default output-dir is
./dist
, although it can be changed in./angular-cli.json
.Deployable Files
The result of the build step is the following:
(Note:
<content-hash>
refers to hash/fingerprint of the contents of the file that’s meant to be a cache-busting way, this is possible since Webpack writes thescript
tags by itself)./dist/assets
Files copied as-is from./src/assets/**
./dist/index.html
From./src/index.html
, after adding webpack scripts to it
The source template file is configurable in./angular-cli.json
./dist/inline.js
Small webpack loader / polyfill./dist/main.<content-hash>.bundle.js
The main .js file containing all the .js scripts generated / imported./dist/styles.<content-hash>.bundle.js
When you use Webpack loaders for CSS, which is the CLI way, they are loaded via JS here
In older versions it also created gzipped versions for checking their size, and
.map
sourcemaps files, but this is no longer happening as people kept asking to remove these.
Now Upload Dist.zip Files to your Admin Panel Domain/public_html and extract the files on root of the project.. make sure all the files must be in root of your public_html