feat: spritemap is on cache?

[matteobertoldo]

Hi! 👋 I use this plugin with the latest version of webpack (>=5.0.0)...it works very well!... but every time I save a file other than a .svg extension a spritemap is generated again..it seems that the final bundle is not in cache. What happens with the .scss & .js files instead (the first two modules are cached as you can see from the screenshot)

Here is my configuration:

new SVGSpritemapPlugin('src/svg/**/*.svg', {
  output: {
     filename: 'svg/spritemap.svg'
  },
  sprite: {
    prefix: 'icon-',
    generate: {
      title: false
    }
  }
});

I forgot any settings? Thanks 😊

[cascornelissen]

Hmm, to be honest I have actually never looked into this. I was kind of expecting Webpack to handle this internally but we might need to add some logic to make it clear to the compiler that nothing changed somehow.

If you (or anyone else reading this) wants to; feel free to dig into this and submit a PR. If nothing happens with it I might check it out once I have some free time again.

[cascornelissen]

@matteobertoldo, is there any specific setup you use to get these [cached] indicators in your output? I've been trying to get them to show up for some simple JS files but they're never in the stats output 😅

---

Nevermind, misread the docs, setting cache to true in the Webpack configuration adds them.

[matteobertoldo]

@cascornelissen here is my configuration! 😊

Now I try to set the cache settings to true and update you. Don't work with cache set to true :(

The reason I get the badge ([cache]) by default would seem because the other extensions I am compiling, go through loaders. In fact for the scss | js files here is the point ...

[cascornelissen]

@matteobertoldo, I'm pretty sure I know where the problem lies but it boils down to the fact that an asset (the spritemap SVG) can't have cache dependencies within the Webpack internals. Which is strange, because the stats printing logic does check whether the cached property on the asset object is truthy. I'm digging some deeper into this 🕵🏼

Do your projects have any other assets (not modules like .js files/entries, but files generated by plugins) that do get cached properly?

[matteobertoldo]

unfortunately I only have .scss, .js and .svg files to compile. I have no other types of assets that come from other plugins, so I can keep track of whether it manages to keep the cache or not...

[cascornelissen]

Phew, that was quite the rabbit hole but the changes in 4db4ca6 should improve this and it also includes some other minor performance improvements. Since this is quite a large refactor please test it out thoroughly in your setup @matteobertoldo (also with Webpack 4 if that's feasible for you).

You can install these recent changes directly from GitHub using the following command.

npm install cascornelissen/svg-spritemap-webpack-plugin#master

Let me know if it solves the issue on your side ✌🏼

[matteobertoldo]

@cascornelissen mmmh: HookWebpackError: compilation.options.plugins.filter(...).flatMap is not a function

[cascornelissen]

Whoops, that's my bad, you're probably on an older version of Node.js. Commit 1ebaa74 fixes this, could try again? 😅

[matteobertoldo]

@cascornelissen well done! 🙇🏽‍♂️💯 Perfect! waiting for the next release! 😊

Thank u so much!

[cascornelissen]

Good to hear! I'm aiming to combine this together with the fix for #135 in the next release. I'll post a comment in both issues when the release is available ✌🏼

[cascornelissen]

These changes were included in 3.8.0, thanks once more for reporting the issue! 🚀