Odd behavior when generating a manifest file
thasmo opened this issue · comments
I'm generating multiple sprites with the following options:
{
name: 'sprites/global.[hash:8].svg',
iconName: '[name]',
}
{
name: 'sprites/brand-one.[hash:8].svg',
iconName: '[name]',
}
{
name: 'sprites/brand-two.[hash:8].svg',
iconName: '[name]',
}
In addition, I'm using webpack-assets-manifest
to generate a manifest.json
, which maps plain file names to generated, hashed file names. webpack-assets-manifest
creates a file like this:
{
"global.svg": "/static/sprites/global.bc0840f3.svg",
"brand.svg": "/static/sprites/brand-one.b71064f3.svg"
}
The problem is that the contents of the manifest.json
file contains only a single brand.svg
entry, which is named wrong (should be sprites/brand-one.svg
) and in addition to that, it lacks the file sprites/brand-two.svg
.
I was not able to find out what the actual problem is, but could it be that external-svg-sprite-loader
is emitting files in a not-so-optimal format or something similar?
The correct output of the manifest.json
file would be:
{
"sprites/global.svg": "/static/sprites/global.bc0840f3.svg",
"sprites/brand-one.svg": "/static/sprites/brand-one.b71064f3.svg",
"sprites/brand-two.svg": "/static/sprites/brand-one.b71064f3.svg"
}
Of course, this could also be a bug in webpack-assets-manifest
, but I thought I may ask here first to be sure it's not a problem with external-svg-sprite-loader
or my configuration or something. What is a bit confusing is the fact that the key in the manifest.json
is called brand.svg
and not brand-one.svg
, which is weird, because brand.svg
is not something I have configured anywhere at all.
By the way, the sprite files are generated correctly.
It seems that using a dash (-
) in the name
option is the problem.
The configs ...
{
name: 'sprites/one.[hash:8].svg',
iconName: '[name]',
}
{
name: 'sprites/two.[hash:8].svg',
iconName: '[name]',
}
{
name: 'sprites/three.[hash:8].svg',
iconName: '[name]',
}
are successfully used on the generated manifest.json
...
"one.svg": "/static/sprites/one.baa8a64a.svg",
"two.svg": "/static/sprites/two.7ba348af.svg",
"three.svg": "/static/sprites/three.16fdbfb9.svg",
... but using sprites/brand-one.[hash:8].svg
, sprites/brand-two.[hash:8].svg
, etc. will be reduced to a single entry in the manifest.json
file with the key brand.svg
.
@thasmo I might be wrong but I don't see why this would be a problem with this package. Could you try to use https://www.npmjs.com/package/webpack-manifest-plugin and see if it results in the same behavior? I used it before and never had problems with it. I guess webpack-assets-manifest
is using a regex somewhere that does not take dashes into account 🤔
@bensampaio I've tried it with assets-webpack-plugin
and it behaves similarly; it somehow ditches everything after a dash, including the dash. When not using a dash in the name
it works fine.
@bensampaio That seems to fix it, awesome!
Cool! I'll see if I get it merged and release it this week :)
The fix is now merged and released so I'll close this issue. Thanks for reporting!