时间戳

首页 > 解决方案 > 在没有 webpack 的 React 中使用本地图像的简短语法？

reactjs - 在没有 webpack 的 React 中使用本地图像的简短语法？

问题描述

我可以像这样使用 html img 显示本地图像：

import youtube from "./youtube.png"

和

<img src={youtube}/>

但是，我有数百个图像我想使用 import，所以我不想要数百个 import 语句。img src 是否有更短的语法来引用 React 中的本地图像？而如果 webpack 是唯一的出路，那么 webpack 会花费很多时间来设置吗？既然我在这个话题上，网站通常如何显示图像？开发人员是在部署网站时下载图像并上传这些文件，还是直接使用 src="https://....."？

抱歉，如果问题太多，我真的只关心引用本地图像的语法，谢谢。

标签： reactjs

解决方案

如果您不想使用 webpack，可以将它们全部放在公用文件夹中并以这种方式访问​​它们。

据我所知，没有比您提到的导入图像的方法更短的方法了，当然您也可以使用webpack，一旦设置好就可以引用它。

作为旁注，这是来自关于公共文件夹使用的 React 文档：

  • 您有数千张图像，需要动态引用它们的路径。

您可以在这里阅读更多相关信息：https ://facebook.github.io/create-react-app/docs/using-the-public-folder

推荐阅读