Questions tagged [next-images]

This tag should be used for any questions regarding the next-images npm package. Please, do not use this tag for next/image related questions (use [nextjs-image] instead).

89 questions
0
votes
0 answers

next build fails with webpack

When I run next build in my project I got this error In my ./src/modules/materials/HighIndex156/HighIndex156.tsx I got: import React from 'react'; import { Typography, Grid, Box } from "@mui/material"; import { useRouter } from…
0
votes
0 answers

Images Don't Render On Next 13.1.6

I try using flowbite carousel with next app. Before the page become interactive, the image has a hidden class. After page become interactive, a JavaScript file removes the hidden class and makes slider work. The problem is when JavaScript loads, and…
UNHOT
  • 1
  • 2
0
votes
1 answer

NextJs image went in infinite loop with error: "url" parameter is valid but upstream response is invalid

I am using next/image component with next js ^12.2.3-canary.17 version for my project now issue what i am facing here with this image component is some images were missing from the source directory itself.For this reason it returns infinite error…
Manish Jha
  • 263
  • 2
  • 13
0
votes
1 answer

Next.js: how to async load image before user navigates to the component where it is rendered

I'm working on a Next.js application which consists of a single page, however, users are able to click on a few buttons that should reveal an image. I want to force clients to download the image before the user reveals this image through a click.…
IVR
  • 1,718
  • 2
  • 23
  • 41
0
votes
0 answers

how to us the assetPrefix option of the next-images npm package

I am using the next-images package in my nextJS application. (https://www.npmjs.com/package/next-images) The documentation says: You can serve remote images by setting assetPrefix option However when I set the assetPrefix option in the…
Ayo Adesina
  • 2,231
  • 3
  • 37
  • 71
0
votes
1 answer

How to Config next-images with existing next.config.js file

I want to use the npm package next-images in my nextjs app. After reading the documentation for next-images, it says you need to create a next.config.js file with the following code: const withImages = require('next-images') module.exports =…
Ayo Adesina
  • 2,231
  • 3
  • 37
  • 71
0
votes
1 answer

how to show next/image in domain ip public

Hello i have issue to get src url image with next/image, i already setup in next.config.js but still error. here my code index.js logo
Mr-T
  • 113
  • 12
0
votes
0 answers

React JS responsive height and width

How can I make the height and width of a div grow and shrink with their aspect ratio while resizing the window?. I'm using tailwind css with next JS and I want to make my div responsive while resizing the window, and in doing that I need the height…
mobix
  • 465
  • 4
  • 10
0
votes
2 answers

Next JS responsive image with custom size

I'm trying to implement an image grid like in AirBnB with Next JS. so I'm Using Next Image with responsive layout. but i wanted to make the image square. meaning the height and width should be the same. but when in responsive layout the image is set…
Mohammed Bekele
  • 727
  • 1
  • 9
  • 25
0
votes
1 answer

NextJS: Image warning error "Please make sure it has an appropriate `as` value and it is preloaded intentionally."

Got this error message on the console The resource "xxx.svg" was preloaded using link preload but not used within a few seconds from the window's load event. Please make sure it has an appropriate as value and it is preloaded intentionally. And…
Johannes
  • 60
  • 4
0
votes
0 answers

Nextjs output tracing system (standalone mode) not optimizing images?

I already create an issue in nextjs- https://github.com/vercel/next.js/issues/41287. My problem is I use next js standalone mode for deploying my site into aws ec2. I successfully do this. My site is running in this url-…
0
votes
0 answers

Getting 503 error on some image using next/image and aws s3 with hostend on amplify?

I am facing one problem when I am host my project to aws amplify. I successfully build a demo ecommerce project. I deploy this next js project to aws amplify. I use next/image component on my project. When I enter my site, I can see some images(Not…
Savana
  • 53
  • 1
  • 6
0
votes
1 answer

Invalid src prop ({REDACTED URL}) on 'next/image', hostname is not configured under images in your 'next.config.js'

I started to get this error even though cdn domain was correctly configured in next.config.js. After searching for couple hours with no answer, So I'm posting the answer below for future reference.
Abdul Mahamaliyev
  • 750
  • 1
  • 8
  • 20
0
votes
1 answer

How to use next/image inside npm packege

I have next.js wrapper project around react ui library, which is included as npm package. Is there a way to use next/image for images optimization inside this React library? I know that import next/image inside react project is not possible. So what…
Mary Oleksiuk
  • 105
  • 2
  • 17
0
votes
0 answers

Auto Shrinks the image despite fixed layout in FLex Container?

Next IMAGE autoshrinks the image despite specifying fixed layout as you add more content to the other flex row element. Here's the example sanbox: https://codesandbox.io/s/fragrant-water-ecgqpc?file=/pages/index.js:495-513 Expected Behaviour is…
Shivam Sahil
  • 4,055
  • 3
  • 31
  • 62