gzip not getting created on ng build --prod

[cyrilcherian]

OS

Linux 14

Versions.

@angular/cli: 1.0.0-rc.1
node: 6.4.0

Repro steps.

ng build --target=production
or
ng build --prod

Does not generate the gzip for any of the js file in the dist folder.

[RicardoVaranda]

Dupe of #5272 , This is outside of the scope of cli, you should be configuring the gzip settings in the server which is hosting your files like apache/nginx etc.

[filipesilva]

Closing as dupe, thanks @RicardoVaranda!

[kaynz]

@RicardoVaranda @filipesilva
Most webservers (like nginx) are able to serve static files, e.g. if you have a vendor.bundle.js.gz next to your vendor.bundle.js, it'll serve the already compressed .gz file instead of using cpu to compress it again.

Therefore I think it would be great if ng build --prod would create gzipped files directly.

[vcorr]

I agree, I understood it did create gz-files at some point, but this functionality was removed?

[John0x]

I don't see a reasony, why the cli should not support gzipping. Why has it been removed?

[jgodi]

You can see the answer here: #4618 (comment)

[drjackson]

I wish there was still at least an option for gzip.

[zac1st1k]

in fact, webpack-dev-server supports gzip. https://github.com/webpack/webpack-dev-server/tree/master/examples/compression Anguar CLI can pass the parameter down to the server. It is really good for estimating the production performance on a local environment.

[tan9]

I ended up using "gzip-all":https://www.npmjs.com/package/gzip-all in my package.json:

{
    "...": "...",
    "scripts": {
        "...": "...",
        "build-prod": "ng build --prod && gzip-all \"dist/anti-fraud/*.*\"",
        "...": "...",
    },
    "...": "...",
}

[rynop]

I think the trend is for SPA to be hosted in a static object store like S3. While a CDN can be put in front to gzip on the fly, IMO it is a waste.

My vote would be to put it back into ng build as an optional param, given the number of people that need the use case and the trend mentioned above.

For those looking for a workaround:

package.json:

...
    "build:prod": "ng build --prod --build-optimizer --delete-output-path --aot",
    "deploy:prod": "yarn run build:prod && gzip-all \"dist/my-webapp/*.{css,js,html}\" && bin/deploy.sh www.me.io",
...

bin/deploy.sh:

#!/bin/bash

APP_NAME=my-webapp
if [[ "$1" != "" ]]; then
    S3BUCKETNAME="$1"
else
    echo ERROR: Failed to supply S3 bucket name
    exit 1
fi

for old in dist/${APP_NAME}/*.gz; do mv $old ${old%%.gz*}; done
aws s3 sync dist/${APP_NAME} s3://${S3BUCKETNAME} --metadata-directive REPLACE --cache-control max-age=31536000,public --acl public-read --exclude "index.html" --exclude "*.css" --exclude "*.js" || { echo 'ERROR: s3 sync failed' ; exit 1; }
aws s3 sync dist/${APP_NAME} s3://${S3BUCKETNAME} --metadata-directive REPLACE --cache-control max-age=31536000,public --acl public-read --exclude "*" --include "*.css" --include "*.js" --content-encoding gzip || { echo 'ERROR: s3 js/css sync failed' ; exit 1; }
aws s3 cp dist/${APP_NAME}/index.html s3://${S3BUCKETNAME}/index.html --metadata-directive REPLACE --cache-control max-age=0,no-cache,no-store,must-revalidate --content-type text/html --acl public-read --content-encoding gzip || { echo 'ERROR: s3 cp index failed' ; exit 1; }

[tdev9]

Optional params to generate gzip would be very helpful to don't have to use workarounds.

[angular-automatic-lock-bot]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}