Using gzip with Nginx and Vue CLI project

nginx.conf

...
    gzip on;
    gzip_static on;    
    gzip_types text/plain text/css application/json application/x-javascript text/xml application/xml application/xml+rss text/javascript;
    gzip_proxied  any;
    gzip_vary on;
    gzip_comp_level 6;
    gzip_buffers 16 8k;
    gzip_http_version 1.1;    
...

vue.config.js

// In vue.config.js:

const CompressionWebpackPlugin = require('compression-webpack-plugin')
const productionGzipExtensions = ['js', 'css']

module.exports = {
  configureWebpack: {
    plugins: [
      new CompressionWebpackPlugin({
        filename: '[path].gz[query]',
        algorithm: 'gzip',
        test: new RegExp('\\.(' + productionGzipExtensions.join('|') + ')$'),
        threshold: 10240,
        minRatio: 0.8
      }),
    ],
  },
};

awesome

 ERROR  TypeError: Cannot read property 'tapPromise' of undefined

Which version did you use?

 ERROR  TypeError: Cannot read property 'tapPromise' of undefined

Which version did you use?

Most likely the plugin version doesn't match Webpack version

The line filename: '[path].gz[query]', no longer works, file names come out as .gz.
Should be replaced with filename: '[file].gz[query]',.

in my case was needed to add application/javascript to gzip_types