![](/img/trans.png)
[英]Using SVG as React Component from Private React UI Library-(CRA) inside React app with Webpack 5 crash
[英]Using SVG files as a React Component in a CRA app
我正在嘗試導入一個 svg 文件,但作為一個反應組件,但我看不到實際的圖標。 我希望看到一個主頁圖標,但我看到的只是一個充滿黑色的人物。
我試過的
import {ReactComponent as Home} from '../assets/svgs/home.svg';
import {List, ListItem, ListItemIcon} from '@material-ui/core';
<List>
{['Home', 'Video', 'Music', 'Sound', 'Painting', 'Images', 'Heritage', 'Fashion'].map((text, index) => (
<ListItem button key={text}>
<ListItemIcon>{index % 2 === 0 ? <Home/> : <MailIcon />}</ListItemIcon>
<ListItemText primary={text} />
</ListItem>
))}
<List/>
我的 SVG 文件
<?xml version="1.0" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 20010904//EN"
"http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd">
<svg version="1.0" xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 512.000000 512.000000"
preserveAspectRatio="xMidYMid meet" width="25px" height="25px">
<g transform="translate(0.000000,512.000000) scale(0.100000,-0.100000)"
fill="#000000" stroke="none">
<path d="M0 2560 l0 -2560 2560 0 2560 0 0 2560 0 2560 -2560 0 -2560 0 0
-2560z"/>
</g>
</svg>
我得到了什么
我究竟做錯了什么? 我真的很感激你的幫助。
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.