Comments (8)
@thasmo I looked into it and I think I might have found the source of the problem. Could you give it a try with the changes in: #60 and let me know if that works for you?
from external-svg-sprite-loader.
Cool! I'll see if I get it merged and release it this week :)
from external-svg-sprite-loader.
The fix is now merged and released so I'll close this issue. Thanks for reporting!
from external-svg-sprite-loader.
By the way, the sprite files are generated correctly.
from external-svg-sprite-loader.
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
.
from external-svg-sprite-loader.
@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 🤔
from external-svg-sprite-loader.
@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.
from external-svg-sprite-loader.
@bensampaio That seems to fix it, awesome!
from external-svg-sprite-loader.
Related Issues (20)
- Clearer errors when trying to use the latest version with Webpack 4
- Duplicated IDs in icon sprite
- angular13 not generate sprite file
- It doesn't work with webpack 5 cache=filesystem
- SVGO Options HOT 4
- "TypeError: loaders is not iterable" after upgrade to v4 HOT 8
- consistency with others loaders in manifest.json HOT 4
- Error when defining Rule.use as a function HOT 2
- Using `webpack-chain` breaks default options HOT 1
- It doesn't generate svg sprite HOT 17
- The module removes "fill" attribute when converting to symbol HOT 2
- Alternative (simpler) way to address the images inside the sprite (no math) HOT 1
- deprecation warning for chunk.files in webpack 5 HOT 1
- The sprite status is blocked: origin (webpack --mode production) HOT 23
- Can't run in storybook
- Deprecation warning for Chunk.modulesIterable
- Breaks with [email protected] HOT 3
- SvgStorePlugin fails if there are any other unrelated errors in the build HOT 1
- Support and compatibility with Webpack 4 regarding mini-css-extract-plugin HOT 6
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from external-svg-sprite-loader.