Add feature to configure filenames to append hash

[MrXyfir]

Something like webpack's output.filename so we can set a string like '[name].[hash].[ext]' or a function.

[brunocodutra]

Which files would you like to rename?

[MrXyfir]

All of them. Anything the plugin outputs.

For example, file-loader supports it: https://github.com/webpack-contrib/file-loader#name

[brunocodutra]

Thanks for clarifying.

If the goal is to overcome caching issues, it should be enough if you specify [hash] as a substring to WebappWebpackPlugin's prefix option, which supports all such placeholders. Do you have a use case that is not covered by this?

Making the name of each individual file is more involved however and should rather be supported upstream by favicons. I'm not convinced it would be a good idea though, what should happen for example if file names clash?

[MrXyfir]

I didn't realize that prefix supported [hash].

It'd still be nice to have more control over it, especially if for some reason you wanted certain files not to have the hash or whatever prefix you set.

I think if there are name clashes that's the end-user's problem. Just overwrite as usual.

I agree though this would probably to some degree need favicons support.

[MrXyfir]

So, experimenting with prefix is yielding some odd results...

If I set prefix to anything other than an empty string, four things happen:

1. manifest.json is output as normal, without the prefix.
2. The icons[].src links in manifest.json do not contain the prefix.
3. Everything else is never output.
4. The links injected into my HTML template do contain the prefix.

Essentially, as far as I can tell, only 4 is working correctly.

new WebappWebpackPlugin({
      favicons: {
        appleStatusBarStyle: 'default',
        appDescription: '...',
        developerName: '...',
        developerURL: '...',
        appShortName: '...',
        theme_color: '#1976d2',
        background: '#fafafa',
        start_url: '/',
        version,
        appName: '...',
        display: 'standalone',
        icons: {
          appleStartup: false,
          appleIcon: true,
          favicons: true,
          android: true,
          firefox: true,
          windows: false,
          yandex: false,
          coast: false
        },
        lang: 'en-US',
        dir: 'ltr'
      },
      inject: true,
      prefix: '',
      cache: true,
      logo: './icon.png'
    }),

[brunocodutra]

Hi @MrXyfir, somehow your latest comment went under my radar, apologies for the late response.

I'm not able to reproduce the behavior you describe, in fact there is a unit test to verify that it works as expected. As you can see in the test fixtures, setting prefix: 'custom/prefix/[hash:8]' results in

• all files being output to custom/prefix/ff471a00/;
• links injected in index.html and manifest.json to correctly include the prefix;

Could you share more details of your setup? I suspect something else, perhaps another plugin, might be interfering with the behavior of webapp-webpack-plugin.

[MrXyfir]

Odd. I'll have to experiment again with it when I get a chance. If you'd like to see the full webpack config you can find it here:

https://github.com/xyfir/illuminsight/blob/master/web/webpack.config.js

Obviously I'm not using prefix now, but if I remember correctly I had it set to [hash].