反应从公用文件夹VS导入服务图像

时间:2020-07-18 15:41:32

标签: reactjs image responsive-design next.js srcset

我知道有几种存储方式以及如何在React中提供图像。 两个选项是:

  1. 将图像存储在公用文件夹中,然后像这样使用它:

    <img src={process.env.PUBLIC_URL + '/someImage.jpg'} />

  2. 将图像存储在项目中的其他位置,将其导入并像下面这样使用:

    import image from '../../assets/images/someImage.jpg'

    <img src={image} />

我现在需要使用 srcSet 创建一个img标签,其中包含少量图像,这些图像会根据屏幕宽度显示正确的尺寸。 为了避免像我今天一样(我正在使用如上所述的第二种方法),添加很多行代码(每个图像4或5个大小)来导入图像,我想也许将它们移到公用文件夹中,然后不需要导入许多版本,也无需在srcSet中提及所有这些版本。

我的问题是

使用我上面写的第一种方法和第二种方法提供图像之间的区别是什么?

,您将使用哪个选项? 如果您有很多图像,并且希望为每个图像设置srcSet且版本很少?

0 个答案:

没有答案