create-react-app: Compilation error occurs for "use" tag w/ xlink:href attribute
If you are reporting a bug, please fill in below. Otherwise feel free to remove this template entirely.
Can you reproduce the problem with latest npm?
I’m using the latest yarn version, yes it is reproducible.
Description
Using <use xlink:href="#icon-1"></use>
(inside an svg tag) in a jsx render function will cause a an error. This is likely an error in the transpiler but I’m not sure how to verify it. It is not able to handle the colon in xlink:href
.
Expected behavior
A use tag should be rendered
Actual behavior
I get the following error:
Module build failed: TypeError: name.toLowerCase is not a function
at Array.forEach (native)
@ ./src/containers/App/App.js 40:22-67```
### Environment
Run these commands in the project folder and fill in their results:
1. `npm ls react-scripts` : react-scripts@0.9.0
2. `node -v`: v7.6.0
3. `npm -v`: 4.1.2
Then, specify:
1. Operating system: Mac OS X 10.11.6
2. Browser and version: Chrome Version 56.0.2924.87 (64-bit)
Sorry I'm not able to make a repro of it, I'm not familiar with the svg tag. If I get some time tomorrow I'll look into it and make one.
About this issue
- Original URL
- State: closed
- Created 7 years ago
- Comments: 15 (7 by maintainers)
You need to use
xlinkHref
, notxlink:href
. 😄