Install gzipper package (https://www.npmjs.com/package/gzipper).
Modify build command like this
"build": "react-scripts build && gzipper --verbose ./build"
and build your project you will get both gzip and regular file. It is upto you to make server to serve gzip instead of regular file. If you are using nginx you have to setup your server in nginx.conf file as below
server {
# Gzip Settings
gzip on;
gzip_static on; # allows pre-serving of .gz file if it exists
gzip_disable "msie6"; # Disable for user-agent Internet explorer 6. Not supported.
gzip_proxied any; # enable gzip for all proxied requests
gzip_buffers 16 8k; # number and size of buffers to compress a response
gzip_http_version 1.1;
gzip_min_length 256; # Only gzip files of size in bytes
gzip_types text/plain text/css text/html application/javascript application/json application/x-javascript text/xml application/xml application/xml+rss text/javascript application/vnd.ms-fontobject application/x-font-ttf font/opentype image/svg+xml image/x-icon;
gunzip on; # Uncompress on the fly
listen 4000;
server_name localhost;
location / {
root html/react-app;
index index.html index.htm;
}
error_page 500 502 503 504 /50x.html;
location = /50x.html {
root html;
}
}
与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…