Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Webpack 5! Is svg-sprite-loader compatible with Webpack 5? #479

Open
Borovensky opened this issue Jan 14, 2022 · 5 comments
Open

Webpack 5! Is svg-sprite-loader compatible with Webpack 5? #479

Borovensky opened this issue Jan 14, 2022 · 5 comments

Comments

@Borovensky
Copy link

Borovensky commented Jan 14, 2022

Webpack 5! Is svg-sprite-loader compatible with Webpack 5?
I update my application from 4 to 5 webpack and seems sprite stop working properly.
svg-sprite-loader is not generated symbol anymore, instead I got this data data:image/svg+xml;base64

Current behavior
I receive this as output:
Screenshot from 2022-01-14 15-13-03

Expected behavior
With webpack 4 I have this:
Screenshot from 2022-01-14 13-01-04

This is a part of my webpack config
Screenshot from 2022-01-14 15-35-32

environment:

  • Node.js version: 12.17.0
  • React version: 17.0.2
  • webpack version: 5.66.0
  • svg-sprite-loader version: 6.0.11
  • OS type & version: Ubuntu

I tried many cases and config changes...but with no success. I don't know even to what I should pay attention, because there are no visible errors while building the app.
also there is no info in readme regarding webpack5.

I would really appreciate any help. Thanks.

@chrisands
Copy link

Here #470 I posted diff that also adds webpack@5 support.

@Borovensky
Copy link
Author

Hi @chrisands. Thanks. I will check it out.

@luckydrq
Copy link

Set Rule.type to javascript/auto works for me.

image

@EricHan0723
Copy link

Set Rule.type to javascript/auto works for me.

image

seems work for me too

@uglu
Copy link

uglu commented Mar 9, 2023

Set Rule.type to javascript/auto works for me.

image

This needs to be added to the documentation. I searched for this solution almost an entire day. Is it a webpack or a loader specific config? In my case, i was doing a require.context for the svgs and importing them all from a folder. Before i upgraded webpack, i was getting actual modules but after the upgrade i was just getting strings

const requireContext = require.context('./assets/svg', true, /\.svg$/)
requireContext.keys().forEach(requireContext)

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

5 participants