在 React.js 代码中使用 .svg 文件时出现问题答案

【问题标题】：Trouble while using .svg file in React.js code在 React.js 代码中使用 .svg 文件时出现问题
【发布时间】：2022-01-13 17:46:33
【问题描述】：

我正在尝试在我的 react 项目中使用插图 (https://storyset.com/illustration/market-launch/pana/animate) [我试图在我的代码中使用的插图图像https://i.stack.imgur.com/AQr8P.png

我选择 SVG 和 CSS 我得到了长编码的 .svg 文件，谁能帮助我，我如何在我的反应代码中使用 SVG 文件

【问题讨论】：

【解决方案1】：

将该文件导入您要使用的位置：

从“./yoursvg.svg”导入 { ReactComponent as NameOfYourSvg }

将 NameOfYourSvg 替换为您要使用的名称，它必须以大写字母开头。

之后，只需在您的代码中使用 svg 即可：

<div>
<NameOfYourSvg />
<div>

【讨论】：