如何在Next.js中加载外部图像?

Dijiflex

JavaScript,我正在从https://picsum.photos加载随机图像,但是它不起作用。请注意,目前,我不想在next.js中使用新的图像优化。本地图像有效,但外部图像无效。下面是我的代码和我的next.config.js

<Slider
            {...settingsThumbs}
            asNavFor={nav1}
            ref={slider => setSlider2(slider)}
          >
            {slidesData.map(slide => (
              <div className='slick-slide' key={slide.id}>
                <img
                  className='slick-slide-image'
                  src={`https://picsum.photos/800/400?img=${slide.id}`}
                  alt='sfd'
                />
              </div>
            ))}
          </Slider>

下面是我的next.js配置

module.exports = {
  images: {
    domains: ['https://picsum.photos/']
  }
};

卡梅伦·赫德

根据文档,该域似乎不需要在其前面的协议(https或http)。尝试

module.exports = {
  images: {
    domains: ['picsum.photos']
  }
};

我还怀疑您在控制台中遇到了以下错误,并关闭了此源代码

域值必须遵循格式{ domain: 'picsum.photos', ... }在此处查看更多信息:https:// err.sh / next.js / invalid-i18n-config`

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章