在通過styled-component引入精靈圖時,兩種方式

方式一：通過import引入

import img1 from '../../assets/img/sprite_01.png';

在img或者background中引入ing1

<img src={img1} alt=""/> //或者 background-image:url(${img1});

方式二：require方式
require只能寫字符串，不能寫變量

background-image:url(${require("../../assets/img/sprite_01.png")});

如果使用require時不顯示，那么只需要加上.default即可

background-image:url(${require("../../assets/img/sprite_01.png").default});

總結

以上是生活随笔為你收集整理的react引入静态图片的方式的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。