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).
Questions tagged [next-images]
89 questions
3
votes
5 answers
Next/Image on Next.js Not Showing
I am using next.js 11.1.0 , my images are not showing saying (image below). I tried upgrading to next.js 12 but the problem still persist. I also tried using img tag and it works fine, just next/image not working. It seems not to work on live site…
Mike Tabag Estonanto
- 133
- 1
- 1
- 8
3
votes
3 answers
NEXT Image: Shrinking inside flexbox with tailwind
I am using NEXT Image component to Fit in with a flex box without shrinking. However, based on the content that is there in the other element, it keeps shrinking:
Here's my code:
import React from 'react';
import Image from 'next/image';
type Props…
Shivam Sahil
- 4,055
- 3
- 31
- 62
3
votes
3 answers
Nextjs Image Component 502 Error in Server
next/image cause the server down of error 502 gateway error.
I check from the devtool network, it go fetch the third party (themoviedb) api. Those images cannot be load correctly but it work fine in my local machine in nextJs build in image…
Wilker
- 551
- 2
- 6
- 21
3
votes
1 answer
Next/Image + Firebase Storage 403 Error on read
I'm trying to use Image from next/image and am using firebase storage to store the image files.
However I'm getting a 403 (forbidden) error when doing the following:
![]()
instead and…
bkbkchoy
- 111
- 1
- 6
3
votes
1 answer
Is it possible to make Next.js Image placeholder without blur?
I'm using Next.js for my projects. Next.js Image component has placeholder and blurDataURL attrs and this combination works very well, but if I want to add my custom placeholder from SVG (SVG->base64) I got blured result.
All my attempts to find…
andrewnosov
- 374
- 4
- 14
3
votes
0 answers
How to setup Next-Images plugin for CDN images only?
I have the following nex.config.js configuration
const withImages = require("next-images");
module.exports = withImages({
fileExtensions: ["jpg", "jpeg", "png", "gif"],
assetPrefix: "https://cdn.mydomain.co.za",
webpack(config) {
return…
Ayabonga Qwabi
- 306
- 5
- 12
3
votes
0 answers
how to dynamically render images in nextjs/react
i am trying to map through an array of images and render in a nextjs app.
const style = {
backgroundImage: `url("${require(`/${post.images}`)}")`,
};
I get this error message:
./public/tech1.jpg 1:0
Module parse failed: Unexpected character…
biggest_boy
- 381
- 4
- 23
2
votes
1 answer
Nextjs13 Images from cloudinary not working in production
error
When I used the component of "next/image", I found that if the src was from cloudinary, it would not display correctly. I tried replacing with the component of "next-cloudinary", and it does display, but only if the src is from cloudinary,…
hongk_bb
- 21
- 1
2
votes
2 answers
Next.js Image keeps showing unconfigured error message
hostname "www.gravatar.com" is not configured under images in your `next.config.js
My config:
const config = {
reactStrictMode: true,
images: {
domains: ["gravatar.com"],
disableStaticImages: true,
},
}
module.exports = config;
I…
Nicole Staline
- 557
- 4
- 15
2
votes
4 answers
Play video with nextjs and reactjs
I have been trying to load a video in my production environment with Next.js, but I can't. I have created public/assets/video route and I have an .mp4 file saved there. There is a public/assets/images route and I have like 50 pictures there and they…
Daniela Ocampo
- 31
- 1
- 5
2
votes
2 answers
NextJS Image fetching huge images with layout='fill'
So, im using cloudinary to serve properly sized images, however, nextJS image seems to be alwasy fetching with w_3840, so images with width of 3840, instead of fixed value.
Clomez
- 1,410
- 3
- 21
- 41
2
votes
1 answer
NextJS Images hosted on AWS S3 in don't show up in production
For a web app I'm developing, all of the images are stored on s3. In the development environment, everything works great and all images load just fine from the external URLs. When deployed however there is no way to load any of the images and they…
TimCrooker
- 101
- 1
- 5
2
votes
1 answer
Background image in nextjs using stylejsx
i'm quite confused with NextJS and background property.
in a component, i want to make a hero section but i don't find how to use it in style jsx.
My component :
const homeTitle = () => (
My title
…user12819179
1
vote
0 answers
New images don't load in Nextjs 13 production mode
I create a full-stack app using Nextjs 13 with the app directory. In dev mode, everything works correctly but in production mode, new images don't load and I get a 404 error in my Chrome DevTools GET http://localhost:3000/uploads/2023/post-2.jpg 404…
Amir Hossein
- 916
- 2
- 13
- 38
1
vote
1 answer
Next image not taking height
I'm giving height and width to a next image, and it doesn't set the height to what I'm telling it to set. It just sets the height to 100% and the widht works fine.
I'm using tailwind for the classes and the divs before do not have any other sizes…
riccardoboe
- 27
- 4