Feature Request: Use SVG-React-Loader

[lucasmotta]

Hello there,

Thanks for such a brilliant work you did so far by implementing CSS-Modules and other CSS pre-processors.

I was wondering if it would be possible to implement the svg-react-loader to handle .svg files on JavaScript.

For me it's a no brainer and it makes life much easier to manipulate and customise SVGs as a React component.

[kitze]

Hey @lucasmotta, I might actually consider this one. Is it really popular? Is there any way to handle svg?

Just curious.

[lnhrdt]

Is it really popular?

Not sure how to measure that, but I'm another developer who's settled on this being the best approach for using SVGs in a React app. Because I totally agree with @lucasmotta:

For me it's a no brainer and it makes life much easier to manipulate and customise SVGs as a React component.

[adizam]

Its the only one worth using IMHO :)

[bensleveritt]

For what it's worth. This is the only outstanding reason for me to eject CRA. Including it would be ace!

[lnhrdt]

Development seems to have slowed down (sincere thanks @kitze for what it is today). So when I came across this issue again today in another project I found another approach I thought I'd share here.

I learned enough odds and ends about create-react-app and Webpack today to write this unfortunate import statement:

import Icon from '!!babel?{"presets":["react-app"]}!react-svg!./icon.svg' // eslint-disable-line import/no-webpack-loader-syntax

It's not an ideal approach but now I can import an *.svg file using react-svg-loader without ejecting.

I tried to invest the time in making a pull request for this issue instead, but the code in react-scripts/config/customizers.js and react-scripts/config/get-custom-config.js wasn't very intuitive to me so I went this direction instead. And I'm trying to ween myself off custom-react-scripts since it's still locked on to react-scripts 0.8.5 but upstream is up to 1.0.7.