标签[next-images] - 堆栈内存溢出

Next.js：如何在用户导航到呈现图像的组件之前异步加载图像 - Next.js: how to async load image before user navigates to the component where it is rendered

我正在开发一个由单个页面组成的 Next.js 应用程序，但是，用户可以单击几个应该显示图像的按钮。我想强制客户在用户通过点击显示该图像之前下载该图像。请注意，图像是在构建时动态解析的，因此我无法将它们预加载到<head>中。我的getStaticProps检索图像 URL，然后在 ...

Next.js 图像一直显示未配置的错误消息 - Next.js Image keeps showing unconfigured error message

hostname "www.gravatar.com" is not configured under images in your `next.config.js 我的配置：更改配置后，我重新启动了服务。此时完全不知所措，似乎只能使用本地图像。 ...

如何使用现有的 next.config.js 文件配置下一个图像 - How to Config next-images with existing next.config.js file

我想在我的 nextjs 应用程序中使用 npm package 下一张图片。阅读 next-images 的文档后，它说您需要使用以下代码创建一个next.config.js文件：但是我已经有一个 next.config.js 文件，目前它里面有如下代码：所以我的问题是，如何将 next-i ...

如何在域 ip public 中显示下一个/图像 - how to show next/image in domain ip public

您好，我在使用 next/image 获取 src url 图像时遇到问题，我已经在 next.config.js 中进行了设置，但仍然出错。这是我的代码索引.js 下一步.config.js 这里还是报错我尝试使用这个主机https://freeimage.host/i/HIV7RRI工作顺利 ...

下一个具有自定义大小的 JS 响应图像 - Next JS responsive image with custom size

我正在尝试使用 Next JS 实现类似于 AirBnB 中的图像网格。所以我使用具有响应式布局的 Next Image。但我想让图像正方形。意味着高度和宽度应该相同。但是在响应式布局中，图像设置为原始大小。我什至尝试制作 object 适合的封面。我怎样才能做到这一点？ ...

下一个图像具有无效的“宽度”或“高度”属性。这些应该是数值 - Next Image has invalid "width" or "height" property. These should be numeric values

我尝试将我的样式定义用于下一个图像元素。但是得到了这个错误。但是，我将其作为我的图像组件。我的全球风格定义。 ...

NextJS：图像警告错误“请确保它具有适当的 `as` 值并且它是有意预加载的。” - NextJS: Image warning error "Please make sure it has an appropriate `as` value and it is preloaded intentionally."

在控制台上收到此错误消息资源“xxx.svg”是使用链接预加载预加载的，但在窗口加载事件后的几秒钟内未被使用。请确保它具有适当as值并且是有意预加载的。这是我的代码我希望在没有警告消息的情况下使用Priority属性进行正确的下一个图像渲染。 ...

如何根据屏幕大小更改 Next/Image？ - How to change Next/Image according to screen size?

我有一个有多张图片的英雄，我想根据屏幕尺寸显示图片，例如，如果用户使用大屏幕，英雄将加载大/宽图像，如果他使用手机，英雄将显示不适合屏幕的不同图像。我不知道如何使用 nextjs 执行此操作，无法指定在不同屏幕上加载哪个图像。 ...

使用 nextjs 和 reactjs 播放视频 - Play video with nextjs and reactjs

我一直在尝试使用 Next.js 在我的生产环境中加载视频，但我不能。我已经创建了public/assets/video路由，并且在那里保存了一个.mp4文件。有一条public/assets/images路线，我在那里有 50 张图片，它们工作得很好。我注意到当我在我的.next/stati ...

下一步/图像没有响应 - Next/image is not responding

在 Next 13 上，将 <img 替换为 <Image 后，图像请求永远不会加载。它是来自产品的 Magento 图片。但是，Magento 的服务器永远不会收到 next 对图像的 GET 请求。例如： http://localhost:3000/_next/image?u ...

Next/Image：当 src 来自另一个网站时，拖动图像不起作用 - Next/Image: Dragging image doesn't work when src comes from another website

我可以拖动以下图像：但是当 src 来自其他网站时，无法拖动图片：为什么以及如何解决？ ...

Nextjs 图像：使用链接预加载进行预加载，但在窗口的加载事件后几秒钟内未使用 - Nextjs Image: was preloaded using link preload but not used within a few seconds from the window's load event

我正在使用基于 React 的框架 Nextjs，我正在尝试在 Next.js 提供的Image组件中显示 logo.png 图像。我有这个文件夹： public/img 这是我的代码：我在控制台中收到此错误：资源 http://localhost:3001/_next/image?url=% ...

'next/image' 上的 src 属性（{REDACTED URL}）无效，主机名未在“next.config.js”中的图像下配置 - Invalid src prop ({REDACTED URL}) on 'next/image', hostname is not configured under images in your 'next.config.js'

即使在 next.config.js 中正确配置了 cdn 域，我也开始收到此错误。在搜索了几个小时没有答案之后，所以我在下面发布答案以供将来参考。 ...

导航栏的下一个/图像阻止 - Next/image blocking for navbar

我使用 next/image 作为 header 图像，但是当我使用导航栏下拉菜单时，图像位于下拉菜单的前面。我该如何解决这个问题，同时仍然使用下一个/图像？ :-) Github： https://github.com/Lucashunt/jameshunt 网址： https://jame ...

如何在 npm 包内使用 next/image - How to use next/image inside npm packege

我有围绕反应 ui 库的 next.js 包装器项目，它包含在 npm package 中。有没有办法在这个 React 库中使用 next/image 进行图像优化？我知道在 react 项目中导入 next/image 是不可能的。那么如果图像在另一个 package 中，那么使用 ne ...

如何使用 Nextjs 和 tailwind 响应式布局？ - How to use layout responsive with Nextjs and tailwind?

我正在尝试使用 NEXTJS 和 Tailwind CSS 中的 flex 创建一张卡片，左侧为图像，右侧为卡片内容。因此，我试图让该图像具有响应性。我对卡片中的图像进行了此设置。图像消失。所以，我尝试使用layout=fill 。图像显示，但它没有像预期的那样获得封面图像效果。这是 ...

下一个/图像在 Next.js 不显示 - Next/Image on Next.js Not Showing

我正在使用 next.js 11.1.0，我的图片没有显示（下图）。我尝试升级到 next.js 12 但问题仍然存在。我也试过使用 img 标签，它工作正常，只是 next/image 不工作。它似乎不适用于现场制作。我的图像存储在本地。有人遇到过这个吗？ ...

下一张图片：随着顺风向内部收缩 flexbox - NEXT Image: Shrinking inside flexbox with tailwind

我正在使用 NEXT Image 组件来适应弹性框而不收缩。但是，根据另一个元素中的内容，它会不断缩小：这是我的代码：有人可以帮我确定如何防止这个问题，因为我一直希望我的图像大小合适并且永不缩小。我尝试使用属性： flex-shrink: 0但这也不起作用。 ...

NextJS Image 使用 layout='fill' 获取巨大的图像 - NextJS Image fetching huge images with layout='fill'

因此，我使用 cloudinary 来提供适当大小的图像，但是，nextJS 图像似乎总是使用 w_3840 获取，因此图像宽度为 3840，而不是固定值。它用 position 包装在 div 中：相对和固定的高度和宽度。 loader如下然后当我重新加载页面并检查图像 src 时，我得到像 ...

在 AWS S3 上托管的 NextJS 图像不会出现在生产环境中 - NextJS Images hosted on AWS S3 in don't show up in production

对于我正在开发的 web 应用程序，所有图像都存储在 s3 上。在开发环境中，一切正常，所有图像都可以从外部 URL 加载。然而，部署时无法加载任何图像，它们只是默认为替代文本。采取的步骤将 s3 bucket base URL 添加到 next.config.js 文件将相同的 URL 添加 ...