Icon fingerprinting should be customizeable

[aminnairi]

Hi there,

Introduction

I really love this plugin and I'm actually using it on my own Webpack template for my projects in Vue, Hyperapp, React and others and it works great!

This is more of a feature request than an issue.

Context

We are already able to use the hash for the generated manifest file, and with the automatic injection in the HTML file, it is a breeze to generate a [hash].json with the <link rel='manifest' href='[hash].json'> and it is just awesome.

Currently, it is possible to have a icon-96x96.[hash].png and it is great for cache busting and things like that.

Feature Request

I was wondering why couldn't we do something like that as well for the icons with maybe an API that could look like that:

const Manifest = require('webpack-pwa-manifest')

module.exports = {
  plugins: [
    new Manifest({
      filename: '[hash].json',
      icons: [
        src: path.resolve(__dirname, 'src', 'images', 'icon.png'),
        sizes: [512, 256, 172, 96],
        filename: '[hash].png' // this is the added feature I was wondering
      ]
    })
  ]
}

Or even something simpler like that (but I really like the for-each-icons-custom-name feature):

const Manifest = require('webpack-pwa-manifest')

module.exports = {
  plugins: [
    new Manifest({
      filename: '[hash].json',
      iconFilename: '[hash].[ext]',
      icons: [
        src: path.resolve(__dirname, 'src', 'images', 'icon.png'),
        sizes: [512, 256, 172, 96],
      ]
    })
  ]
}

Hope I'm being clear and eager to see this feature soon!

[Chris3773]

I would like to see an option for only adding the hash to the icon files and not the manifest.json. The use case for this is when using Angular Universal the index.html file is not part of the webpack pipe line so it can't be injected. With this setup you will need to add the manifest.json file directly to the index.html with it's own cache busting and turn off fingerprinting.