1. Home
  2. Docs
  3. News App
  4. Backend Configuration
  5. Generate Production Build Of Admin Panel

Generate Production Build Of Admin Panel

  • Bundle Steps

    Inside the project folder:

    ng build -prod

    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 running ng build --aot.


    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 the script 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

Was this article helpful to you? Yes No

How can we help?