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

【问题标题】：Short syntax for using local image in React without webpack?在没有 webpack 的 React 中使用本地图像的简短语法？
【发布时间】：2019-02-15 03:08:06
【问题描述】：

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

import youtube from "./youtube.png"

和

<img src={youtube}/>

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

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

【问题讨论】：

您是否正在为<img /> 或import 寻找更短的语法？
直接引用本地 img src 的较短语法 :) 所以我不想从另一个包导入，而是直接引用它，如

标签： reactjs

【解决方案1】：

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

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

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

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

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

【讨论】：

谢谢，很棒的信息！