how to enable gzip compression in angular cli for production build

Angular-cli team has removed the support for generating compress files (.gz). Github discussion url.

We can use a gulp task for it. Install following npm modules:

$npm install --save-dev gulp
$npm install --save-dev gulp-gzip

Create gulpfile.js

var gulp = require('gulp');
var gzip = require('gulp-gzip');

gulp.task('compress', function() {
  return gulp.src(['./dist/**/*.*'])
      .pipe(gzip())
      .pipe(gulp.dest('./dist'));
});

Since .gz support can be configure in web servers but server has to do the zipping it self and expense some cpu cycles for it. If we pre build it then it helps server to save some cpu cycles. :)

We can add it in package.json as script to run after each build of application.

"scripts": {
       ...
       "postbuild": "gulp compress"
       ...
   }

You could achieve this with a simple bash script before transferring them to the server, or even adding it to package.json as a command

 "scripts": {
   "build.prod": "ng build --environment=prod && tar -zcvf archive.tar.gz dist/prod/*",

Not sure what's your folder structure, but you can play around with tar -zcvf archive.tar.gz dist/prod/* in the terminal until you find paths that suite to your needs.

EDIT: Seems I misunderstood the question, if it is about bundle size when serving the stuff to the end user, you should take a look at AOT + Rollup to minimize your bundle sizes. And enable gzip compression on your webserver when serving files (probably most servers have it enabled already).