Netlify Next.js images throw IPX Error 500

gem-ns · February 8, 2022, 12:43pm

Our next.js website hosted on netlify using @netlify/plugin-nextjs is facing issues with few images when deployed to production. It throws back an IPX ERROR 500. We tried looking over the forums and internet but couldn’t find anything useful.
The same stuff works perfectly fine on development server.

Website URL - https://620262faa36330b1dbe1d92a--zelta-fe-uat.netlify.app/trade/BTC_USDT/

netlify.toml

[build]
  command = "yarn run build"
  publish = ".next"

[[plugins]]
  package = "@netlify/plugin-nextjs"

Any help would be appreciated.

hillary · February 8, 2022, 5:15pm

Hey there, @gem-ns

Can you please share your most recent deploy log as well as your project repo? Thanks so much.

gem-ns · February 8, 2022, 5:18pm

Thanks for the reply, Hillary. Can you tell me how to generate/find the deploy logs?
Project repo might not be available since it is a proprietary codebase I understand it’s hard to debug but I’ll be more than happy to provide any details if required.

We have added our images to the public folder in root directory of the project.
For example, we have zelta.png placed in public folder. We refer to it in this way:

 <Image
            src={"/Zelta.png"}
            width="100%"
            height="100%"
            layout="responsive"
            objectFit="contain"
            alt="zelta"
          ></Image>

This is our next.config.js file.

const { withSentryConfig } = require("@sentry/nextjs");
const { routes } = require("./src/routes");
const isProd = process.env.NODE_ENV === "production";
const path = require("path");
const withReactSvg = require("next-react-svg");

const moduleExports = {
  // webpack5: false,

  reactStrictMode: true,
  basePath: routes.BASE_PATH,
  assetPrefix: routes.BASE_PATH,
  publicRuntimeConfig: {
    staticFolder: routes.BASE_PATH,
  },
  sassOptions: {
    includePaths: [path.join(__dirname, "styles")],
  },
  trailingSlash: true,
  experimental: {
    removeConsole: isProd ? true : false,
  },
  images: {
    domains: ["coinlogos.s3.ap-south-1.amazonaws.com"],
  },

  include: path.resolve(__dirname, "src/svg"),
  webpack(config, options) {
    return config;
  },
};

const SentryWebpackPluginOptions = {

};

module.exports = withSentryConfig(
  withReactSvg(moduleExports),
  SentryWebpackPluginOptions
);

Skuut · February 8, 2022, 6:20pm

Hey, I have the exact same issue in my site. Just the Logo file is not served, every other image is loaded…

coelmay · February 8, 2022, 8:50pm

Hi @gem-ns

Deploy logs for your site are available at https://app.netlify.com/sites/YOUR_SITE_NAME/deploys or by selecting the site in the Netlify Dashboard then Deploys in the main navigation.

jess · February 9, 2022, 3:27am

Hi! Same issue for us (again, sorry):

Our site lives at accountingleaderspodcast.com. This wasn’t causing any issues until recently. Here is some relevant code from our deploy logs:


3:37:04 PM: ────────────────────────────────────────────────────────────────
3:37:04 PM:   3. @netlify/plugin-nextjs (onBuild event)                     
3:37:04 PM: ────────────────────────────────────────────────────────────────
3:37:04 PM: 
3:37:04 PM: Patching /opt/build/repo/node_modules/next/dist/server/next-server.js
3:37:04 PM: Moving static page files to serve from CDN...
3:37:04 PM: Moved 44 files
3:37:04 PM: Netlify configuration property "redirects" value changed to [
3:37:04 PM:   { from: '/_next/static/*', to: '/static/:splat', status: 200 },
3:37:04 PM:   {
3:37:04 PM:     from: '/_next/image*',
3:37:04 PM:     query: { url: ':url', w: ':width', q: ':quality' },
3:37:04 PM:     to: '/_ipx/w_:width,q_:quality/:url',
3:37:04 PM:     status: 301
3:37:04 PM:   },
3:37:04 PM:   { from: '/_ipx/*', to: '/.netlify/builders/_ipx', status: 200 },
3:37:04 PM:   { from: '/cache/*', to: '/404.html', status: 404, force: true },
3:37:04 PM:   { from: '/server/*', to: '/404.html', status: 404, force: true },
3:37:04 PM:   { from: '/serverless/*', to: '/404.html', status: 404, force: true },
3:37:04 PM:   { from: '/traces', to: '/404.html', status: 404, force: true },
3:37:04 PM:   {
3:37:04 PM:     from: '/routes-manifest.json',
3:37:04 PM:     to: '/404.html',
3:37:04 PM:     status: 404,
3:37:04 PM:     force: true
3:37:04 PM:   },
3:37:04 PM:   {
3:37:04 PM:     from: '/build-manifest.json',
3:37:04 PM:     to: '/404.html',
3:37:04 PM:     status: 404,
3:37:04 PM:     force: true
3:37:04 PM:   },
3:37:04 PM:   {
3:37:04 PM:     from: '/prerender-manifest.json',
3:37:04 PM:     to: '/404.html',
3:37:04 PM:     status: 404,
3:37:04 PM:     force: true
3:37:04 PM:   },
3:37:04 PM:   {
3:37:04 PM:     from: '/react-loadable-manifest.json',
3:37:04 PM:     to: '/404.html',
3:37:04 PM:     status: 404,
3:37:04 PM:     force: true
3:37:04 PM:   },
3:37:04 PM:   { from: '/BUILD_ID', to: '/404.html', status: 404, force: true },
3:37:04 PM:   {
3:37:04 PM:     from: '/api',
3:37:04 PM:     to: '/.netlify/functions/___netlify-handler',
3:37:04 PM:     status: 200
3:37:04 PM:   },
3:37:04 PM:   {
3:37:04 PM:     from: '/api/*',
3:37:04 PM:     to: '/.netlify/functions/___netlify-handler',
3:37:04 PM:     status: 200
3:37:04 PM:   },
3:37:04 PM:   {
3:37:04 PM:     from: '/favicon.svg',
3:37:04 PM:     to: '/favicon.svg',
3:37:04 PM:     conditions: { Cookie: [Array] },
3:37:04 PM:     status: 200
3:37:04 PM:   },
3:37:04 PM:   {
3:37:04 PM:     from: '/vercel.svg',
3:37:04 PM:     to: '/vercel.svg',
3:37:04 PM:     conditions: { Cookie: [Array] },
3:37:04 PM:     status: 200
3:37:04 PM:   },
3:37:04 PM:   {
3:37:04 PM:     from: '/fonts/MetricWeb-Medium.eot',
3:37:04 PM:     to: '/fonts/MetricWeb-Medium.eot',
3:37:04 PM:     conditions: { Cookie: [Array] },
3:37:04 PM:     status: 200
3:37:04 PM:   },
3:37:04 PM:   {
3:37:04 PM:     from: '/fonts/MetricWeb-Medium.woff',
3:37:04 PM:     to: '/fonts/MetricWeb-Medium.woff',
3:37:04 PM:     conditions: { Cookie: [Array] },
3:37:04 PM:     status: 200
3:37:04 PM:   },
3:37:04 PM:   {
3:37:04 PM:     from: '/fonts/MetricWeb-Medium.woff2',
3:37:04 PM:     to: '/fonts/MetricWeb-Medium.woff2',
3:37:04 PM:     conditions: { Cookie: [Array] },
3:37:04 PM:     status: 200
3:37:04 PM:   },
3:37:04 PM:   {
3:37:04 PM:     from: '/fonts/MetricWeb-Regular.eot',
3:37:04 PM:     to: '/fonts/MetricWeb-Regular.eot',
3:37:04 PM:     conditions: { Cookie: [Array] },
3:37:04 PM:     status: 200
3:37:04 PM:   },
3:37:04 PM:   {
3:37:04 PM:     from: '/fonts/MetricWeb-Regular.woff',
3:37:04 PM:     to: '/fonts/MetricWeb-Regular.woff',
3:37:04 PM:     conditions: { Cookie: [Array] },
3:37:04 PM:     status: 200
3:37:04 PM:   },
3:37:04 PM:   {
3:37:04 PM:     from: '/fonts/MetricWeb-Regular.woff2',
3:37:04 PM:     to: '/fonts/MetricWeb-Regular.woff2',
3:37:04 PM:     conditions: { Cookie: [Array] },
3:37:04 PM:     status: 200
3:37:04 PM:   },
3:37:04 PM:   {
3:37:04 PM:     from: '/fonts/MetricWeb-RegularItalic.eot',
3:37:04 PM:     to: '/fonts/MetricWeb-RegularItalic.eot',
3:37:04 PM:     conditions: { Cookie: [Array] },
3:37:04 PM:     status: 200
3:37:04 PM:   },
3:37:04 PM:   {
3:37:04 PM:     from: '/fonts/MetricWeb-RegularItalic.woff',
3:37:04 PM:     to: '/fonts/MetricWeb-RegularItalic.woff',
3:37:04 PM:     conditions: { Cookie: [Array] },
3:37:04 PM:     status: 200
3:37:04 PM:   },
3:37:04 PM:   {
3:37:04 PM:     from: '/fonts/MetricWeb-RegularItalic.woff2',
3:37:04 PM:     to: '/fonts/MetricWeb-RegularItalic.woff2',
3:37:04 PM:     conditions: { Cookie: [Array] },
3:37:04 PM:     status: 200
3:37:04 PM:   },
3:37:04 PM:   {
3:37:04 PM:     from: '/fonts/MetricWeb-Semibold.eot',
3:37:04 PM:     to: '/fonts/MetricWeb-Semibold.eot',
3:37:04 PM:     conditions: { Cookie: [Array] },
3:37:04 PM:     status: 200
3:37:04 PM:   },
3:37:04 PM:   {
3:37:04 PM:     from: '/fonts/MetricWeb-Semibold.woff',
3:37:04 PM:     to: '/fonts/MetricWeb-Semibold.woff',
3:37:04 PM:     conditions: { Cookie: [Array] },
3:37:04 PM:     status: 200
3:37:04 PM:   },
3:37:04 PM:   {
3:37:04 PM:     from: '/fonts/MetricWeb-Semibold.woff2',
3:37:04 PM:     to: '/fonts/MetricWeb-Semibold.woff2',
3:37:04 PM:     conditions: { Cookie: [Array] },
3:37:04 PM:     status: 200
3:37:04 PM:   },
3:37:04 PM:   {
3:37:04 PM:     from: '/fonts/MetricWeb-SemiboldItalic.eot',
3:37:04 PM:     to: '/fonts/MetricWeb-SemiboldItalic.eot',
3:37:04 PM:     conditions: { Cookie: [Array] },
3:37:04 PM:     status: 200
3:37:04 PM:   },
3:37:04 PM:   {
3:37:04 PM:     from: '/fonts/MetricWeb-SemiboldItalic.woff',
3:37:04 PM:     to: '/fonts/MetricWeb-SemiboldItalic.woff',
3:37:04 PM:     conditions: { Cookie: [Array] },
3:37:04 PM:     status: 200
3:37:04 PM:   },
3:37:04 PM:   {
3:37:04 PM:     from: '/fonts/MetricWeb-SemiboldItalic.woff2',
3:37:04 PM:     to: '/fonts/MetricWeb-SemiboldItalic.woff2',
3:37:04 PM:     conditions: { Cookie: [Array] },
3:37:04 PM:     status: 200
3:37:04 PM:   },
3:37:04 PM:   {
3:37:04 PM:     from: '/images/Chevron-Down-black.svg',
3:37:04 PM:     to: '/images/Chevron-Down-black.svg',
3:37:04 PM:     conditions: { Cookie: [Array] },
3:37:04 PM:     status: 200
3:37:04 PM:   },
3:37:04 PM:   {
3:37:04 PM:     from: '/images/Chevron-Down.svg',
3:37:04 PM:     to: '/images/Chevron-Down.svg',
3:37:04 PM:     conditions: { Cookie: [Array] },
3:37:04 PM:     status: 200
3:37:04 PM:   },
3:37:04 PM:   {
3:37:04 PM:     from: '/images/Chevron-Up.svg',
3:37:04 PM:     to: '/images/Chevron-Up.svg',
3:37:04 PM:     conditions: { Cookie: [Array] },
3:37:04 PM:     status: 200
3:37:04 PM:   },
3:37:04 PM:   {
3:37:04 PM:     from: '/images/apple-podcasts.png',
3:37:04 PM:     to: '/images/apple-podcasts.png',
3:37:04 PM:     conditions: { Cookie: [Array] },
3:37:04 PM:     status: 200
3:37:04 PM:   },
3:37:04 PM:   {
3:37:04 PM:     from: '/images/arrow-right-black.svg',
3:37:04 PM:     to: '/images/arrow-right-black.svg',
3:37:04 PM:     conditions: { Cookie: [Array] },
3:37:04 PM:     status: 200
3:37:04 PM:   },
3:37:04 PM:   {
3:37:04 PM:     from: '/images/arrow-right-white.svg',
3:37:04 PM:     to: '/images/arrow-right-white.svg',
3:37:04 PM:     conditions: { Cookie: [Array] },
3:37:04 PM:     status: 200
3:37:04 PM:   },
3:37:04 PM:   {
3:37:04 PM:     from: '/images/chevron-down-thick.svg',
3:37:04 PM:     to: '/images/chevron-down-thick.svg',
3:37:04 PM:     conditions: { Cookie: [Array] },
3:37:04 PM:     status: 200
3:37:04 PM:   },
3:37:04 PM:   {
3:37:04 PM:     from: '/images/chevron-left-black.svg',
3:37:04 PM:     to: '/images/chevron-left-black.svg',
3:37:04 PM:     conditions: { Cookie: [Array] },
3:37:04 PM:     status: 200
3:37:04 PM:   },
3:37:04 PM:   {
3:37:04 PM:     from: '/images/chevron-right-black.svg',
3:37:04 PM:     to: '/images/chevron-right-black.svg',
3:37:04 PM:     conditions: { Cookie: [Array] },
3:37:04 PM:     status: 200
3:37:04 PM:   },
3:37:04 PM:   {
3:37:04 PM:     from: '/images/google-podcasts.png',
3:37:04 PM:     to: '/images/google-podcasts.png',
3:37:04 PM:     conditions: { Cookie: [Array] },
3:37:04 PM:     status: 200
3:37:04 PM:   },
3:37:04 PM:   {
3:37:04 PM:     from: '/images/karbon-logo-black.svg',
3:37:04 PM:     to: '/images/karbon-logo-black.svg',
3:37:04 PM:     conditions: { Cookie: [Array] },
3:37:04 PM:     status: 200
3:37:04 PM:   },
3:37:04 PM:   {
3:37:04 PM:     from: '/images/karbon-logo-full.svg',
3:37:04 PM:     to: '/images/karbon-logo-full.svg',
3:37:04 PM:     conditions: { Cookie: [Array] },
3:37:04 PM:     status: 200
3:37:04 PM:   },
3:37:04 PM:   {
3:37:04 PM:     from: '/images/karbon-logo-white.svg',
3:37:04 PM:     to: '/images/karbon-logo-white.svg',
3:37:04 PM:     conditions: { Cookie: [Array] },
3:37:04 PM:     status: 200
3:37:04 PM:   },
3:37:04 PM:   {
3:37:04 PM:     from: '/images/logo-accounting-leaders-podcast.svg',
3:37:04 PM:     to: '/images/logo-accounting-leaders-podcast.svg',
3:37:04 PM:     conditions: { Cookie: [Array] },
3:37:04 PM:     status: 200
3:37:04 PM:   },
3:37:04 PM:   {
3:37:04 PM:     from: '/images/logo-alp-black.svg',
3:37:04 PM:     to: '/images/logo-alp-black.svg',
3:37:04 PM:     conditions: { Cookie: [Array] },
3:37:04 PM:     status: 200
3:37:04 PM:   },
3:37:04 PM:   {
3:37:04 PM:     from: '/images/overcast.png',
3:37:04 PM:     to: '/images/overcast.png',
3:37:04 PM:     conditions: { Cookie: [Array] },
3:37:04 PM:     status: 200
3:37:04 PM:   },
3:37:04 PM:   {
3:37:04 PM:     from: '/images/pocket-casts.png',
3:37:04 PM:     to: '/images/pocket-casts.png',
3:37:04 PM:     conditions: { Cookie: [Array] },
3:37:04 PM:     status: 200
3:37:04 PM:   },
3:37:04 PM:   {
3:37:04 PM:     from: '/images/podcast-artwork.png',
3:37:04 PM:     to: '/images/podcast-artwork.png',
3:37:04 PM:     conditions: { Cookie: [Array] },
3:37:04 PM:     status: 200
3:37:04 PM:   },
3:37:04 PM:   {
3:37:04 PM:     from: '/images/podcast-background.svg',
3:37:04 PM:     to: '/images/podcast-background.svg',
3:37:04 PM:     conditions: { Cookie: [Array] },
3:37:04 PM:     status: 200
3:37:04 PM:   },
3:37:04 PM:   {
3:37:04 PM:     from: '/images/social-card-1.png',
3:37:04 PM:     to: '/images/social-card-1.png',
3:37:04 PM:     conditions: { Cookie: [Array] },
3:37:04 PM:     status: 200
3:37:04 PM:   },
3:37:04 PM:   {
3:37:04 PM:     from: '/images/social-facebook-black.svg',
3:37:04 PM:     to: '/images/social-facebook-black.svg',
3:37:04 PM:     conditions: { Cookie: [Array] },
3:37:04 PM:     status: 200
3:37:04 PM:   },
3:37:04 PM:   {
3:37:04 PM:     from: '/images/social-instagram-black.svg',
3:37:04 PM:     to: '/images/social-instagram-black.svg',
3:37:04 PM:     conditions: { Cookie: [Array] },
3:37:04 PM:     status: 200
3:37:04 PM:   },
3:37:04 PM:   {
3:37:04 PM:     from: '/images/social-linkedin-black.svg',
3:37:04 PM:     to: '/images/social-linkedin-black.svg',
3:37:04 PM:     conditions: { Cookie: [Array] },
3:37:04 PM:     status: 200
3:37:04 PM:   },
3:37:04 PM:   {
3:37:04 PM:     from: '/images/social-twitter-black.svg',
3:37:04 PM:     to: '/images/social-twitter-black.svg',
3:37:04 PM:     conditions: { Cookie: [Array] },
3:37:04 PM:     status: 200
3:37:04 PM:   },
3:37:04 PM:   {
3:37:04 PM:     from: '/images/social-youtube-black.svg',
3:37:04 PM:     to: '/images/social-youtube-black.svg',
3:37:04 PM:     conditions: { Cookie: [Array] },
3:37:04 PM:     status: 200
3:37:04 PM:   },
3:37:04 PM:   {
3:37:04 PM:     from: '/images/spotify.png',
3:37:04 PM:     to: '/images/spotify.png',
3:37:04 PM:     conditions: { Cookie: [Array] },
3:37:04 PM:     status: 200
3:37:04 PM:   },
3:37:04 PM:   {
3:37:04 PM:     from: '/images/stitcher.png',
3:37:04 PM:     to: '/images/stitcher.png',
3:37:04 PM:     conditions: { Cookie: [Array] },
3:37:04 PM:     status: 200
3:37:04 PM:   },
3:37:04 PM:   {
3:37:04 PM:     from: '/images/tick-coral.svg',
3:37:04 PM:     to: '/images/tick-coral.svg',
3:37:04 PM:     conditions: { Cookie: [Array] },
3:37:04 PM:     status: 200
3:37:04 PM:   },
3:37:04 PM:   {
3:37:04 PM:     from: '/images/tick-white.svg',
3:37:04 PM:     to: '/images/tick-white.svg',
3:37:04 PM:     conditions: { Cookie: [Array] },
3:37:04 PM:     status: 200
3:37:04 PM:   },
3:37:04 PM:   {
3:37:04 PM:     from: '/images/twitter-black.png',
3:37:04 PM:     to: '/images/twitter-black.png',
3:37:04 PM:     conditions: { Cookie: [Array] },
3:37:04 PM:     status: 200
3:37:04 PM:   },
3:37:04 PM:   {
3:37:04 PM:     from: '/images/mediaplayer/Skip-next-white.svg',
3:37:04 PM:     to: '/images/mediaplayer/Skip-next-white.svg',
3:37:04 PM:     conditions: { Cookie: [Array] },
3:37:04 PM:     status: 200
3:37:04 PM:   },
3:37:04 PM:   {
3:37:04 PM:     from: '/images/mediaplayer/Skip-next.svg',
3:37:04 PM:     to: '/images/mediaplayer/Skip-next.svg',
3:37:04 PM:     conditions: { Cookie: [Array] },
3:37:04 PM:     status: 200
3:37:04 PM:   },
3:37:04 PM:   {
3:37:04 PM:     from: '/images/mediaplayer/Skip-previous-white.svg',
3:37:04 PM:     to: '/images/mediaplayer/Skip-previous-white.svg',
3:37:04 PM:     conditions: { Cookie: [Array] },
3:37:04 PM:     status: 200
3:37:04 PM:   },
3:37:04 PM:   {
3:37:04 PM:     from: '/images/mediaplayer/Skip-previous.svg',
3:37:04 PM:     to: '/images/mediaplayer/Skip-previous.svg',
3:37:04 PM:     conditions: { Cookie: [Array] },
3:37:04 PM:     status: 200
3:37:04 PM:   },
3:37:04 PM:   {
3:37:04 PM:     from: '/images/mediaplayer/cross-grey.svg',
3:37:04 PM:     to: '/images/mediaplayer/cross-grey.svg',
3:37:04 PM:     conditions: { Cookie: [Array] },
3:37:04 PM:     status: 200
3:37:04 PM:   },
3:37:04 PM:   {
3:37:04 PM:     from: '/images/mediaplayer/cross-white.svg',
3:37:04 PM:     to: '/images/mediaplayer/cross-white.svg',
3:37:04 PM:     conditions: { Cookie: [Array] },
3:37:04 PM:     status: 200
3:37:04 PM:   },
3:37:04 PM:   {
3:37:04 PM:     from: '/images/mediaplayer/icon-forward-30-white.svg',
3:37:04 PM:     to: '/images/mediaplayer/icon-forward-30-white.svg',
3:37:04 PM:     conditions: { Cookie: [Array] },
3:37:04 PM:     status: 200
3:37:04 PM:   },
3:37:04 PM:   {
3:37:04 PM:     from: '/images/mediaplayer/icon-forward-30.svg',
3:37:04 PM:     to: '/images/mediaplayer/icon-forward-30.svg',
3:37:04 PM:     conditions: { Cookie: [Array] },
3:37:04 PM:     status: 200
3:37:04 PM:   },
3:37:04 PM:   {
3:37:04 PM:     from: '/images/mediaplayer/icon-replay-30-white.svg',
3:37:04 PM:     to: '/images/mediaplayer/icon-replay-30-white.svg',
3:37:04 PM:     conditions: { Cookie: [Array] },
3:37:04 PM:     status: 200
3:37:04 PM:   },
3:37:04 PM:   {
3:37:04 PM:     from: '/images/mediaplayer/icon-replay-30.svg',
3:37:04 PM:     to: '/images/mediaplayer/icon-replay-30.svg',
3:37:04 PM:     conditions: { Cookie: [Array] },
3:37:04 PM:     status: 200
3:37:04 PM:   },
3:37:04 PM:   {
3:37:04 PM:     from: '/images/mediaplayer/pause-button.svg',
3:37:04 PM:     to: '/images/mediaplayer/pause-button.svg',
3:37:04 PM:     conditions: { Cookie: [Array] },
3:37:04 PM:     status: 200
3:37:04 PM:   },
3:37:04 PM:   {
3:37:04 PM:     from: '/images/mediaplayer/play-button.svg',
3:37:04 PM:     to: '/images/mediaplayer/play-button.svg',
3:37:04 PM:     conditions: { Cookie: [Array] },
3:37:04 PM:     status: 200
3:37:04 PM:   },
3:37:04 PM:   {
3:37:04 PM:     from: '/images/mediaplayer/volume-up.svg',
3:37:04 PM:     to: '/images/mediaplayer/volume-up.svg',
3:37:04 PM:     conditions: { Cookie: [Array] },
3:37:04 PM:     status: 200
3:37:04 PM:   },
3:37:04 PM:   {
3:37:04 PM:     from: '/*',
3:37:04 PM:     to: '/.netlify/functions/___netlify-handler',
3:37:04 PM:     status: 200,
3:37:04 PM:     conditions: { Cookie: [Array] },
3:37:04 PM:     force: true
3:37:04 PM:   },
3:37:04 PM:   {
3:37:04 PM:     from: '/_next/data/7yuyPcSFRMh3_dpMWzg0O/episodes/:slug.json',
3:37:04 PM:     to: '/.netlify/builders/___netlify-odb-handler',
3:37:04 PM:     status: 200,
3:37:04 PM:     force: false
3:37:04 PM:   },
3:37:04 PM:   {
3:37:04 PM:     from: '/episodes/:slug',
3:37:04 PM:     to: '/.netlify/builders/___netlify-odb-handler',
3:37:04 PM:     status: 200,
3:37:04 PM:     force: false
3:37:04 PM:   },
3:37:04 PM:   {
3:37:04 PM:     from: '/*',
3:37:04 PM:     to: '/.netlify/functions/___netlify-handler',
3:37:04 PM:     status: 200
3:37:04 PM:   }
3:37:04 PM: ].
3:37:04 PM: 
3:37:04 PM: (@netlify/plugin-nextjs onBuild completed in 206ms)
3:37:04 PM: 
3:37:04 PM: ────────────────────────────────────────────────────────────────
3:37:04 PM:   4. Functions bundling                                         
3:37:04 PM: ────────────────────────────────────────────────────────────────
3:37:04 PM: 
3:37:04 PM: Packaging Functions from .netlify/functions-internal directory:
3:37:04 PM:  - ___netlify-handler/___netlify-handler.js
3:37:04 PM:  - ___netlify-odb-handler/___netlify-odb-handler.js
3:37:04 PM:  - _ipx/_ipx.js
3:37:04 PM: 
3:37:43 PM: 
3:37:43 PM: (Functions bundling completed in 38.4s)
3:37:43 PM: 
3:37:43 PM: ─────────────────────────────────────────

And see below for the 502 err screenshot:

jess · February 9, 2022, 4:14am

Hi all, I just bumped our plugin down to 4.2.3 and that seems to have fixed things for now. The newest release (4.2.5) causes this issue for us. Please let me know if and when this bug has been fixed!

gem-ns · February 9, 2022, 4:14am

Hey, these are my build logs.


────────────────────────────────────────────────────────────────
  Netlify Build                                                 
────────────────────────────────────────────────────────────────

❯ Version
  @netlify/build 26.2.3

❯ Flags
  {}

❯ Current directory
  <redacted>/Zelta

❯ Config file
  <redacted>/Zelta/netlify.toml

❯ Context
  production

❯ Loading plugins
   - @netlify/plugin-nextjs@4.2.5 from netlify.toml

────────────────────────────────────────────────────────────────
  1. @netlify/plugin-nextjs (onPreBuild event)                  
────────────────────────────────────────────────────────────────

Next.js cache restored.
Netlify configuration property "build.environment.NEXT_PRIVATE_TARGET" value changed.

(@netlify/plugin-nextjs onPreBuild completed in 1.2s)

────────────────────────────────────────────────────────────────
  2. build.command from netlify.toml                            
────────────────────────────────────────────────────────────────

$ yarn run build
yarn run v1.22.17
$ yarn startup
$ node src/utils/startup.js
$ next build
warn  - You have enabled experimental feature(s).
warn  - Experimental features are not covered by semver, and may cause unexpected or broken application behavior. Use them at your own risk.

info  - Checking validity of types  


✨  Done in 55.19s.

(build.command completed in 55.5s)

────────────────────────────────────────────────────────────────
  3. @netlify/plugin-nextjs (onBuild event)                     
────────────────────────────────────────────────────────────────

Patching <redacted>/Zelta/node_modules/next/dist/server/base-server.js
Done
Moving static page files to serve from CDN...
Moved 3 files
Netlify configuration property "redirects" value changed to [
  { from: '/_next/static/*', to: '/static/:splat', status: 200 },
  {
    from: '/_next/image/*',
    query: { url: ':url', w: ':width', q: ':quality' },
    to: '/_ipx/w_:width,q_:quality/:url',
    status: 301
  },
  { from: '/_ipx/*', to: '/.netlify/builders/_ipx', status: 200 },
  { from: '/cache/*', to: '/404.html', status: 404, force: true },
  { from: '/server/*', to: '/404.html', status: 404, force: true },
  { from: '/serverless/*', to: '/404.html', status: 404, force: true },
  { from: '/traces', to: '/404.html', status: 404, force: true },
  {
    from: '/routes-manifest.json',
    to: '/404.html',
    status: 404,
    force: true
  },
  {
    from: '/build-manifest.json',
    to: '/404.html',
    status: 404,
    force: true
  },
  {
    from: '/prerender-manifest.json',
    to: '/404.html',
    status: 404,
    force: true
  },
  {
    from: '/react-loadable-manifest.json',
    to: '/404.html',
    status: 404,
    force: true
  },
  { from: '/BUILD_ID', to: '/404.html', status: 404, force: true },
  {
    from: '/api',
    to: '/.netlify/functions/___netlify-handler',
    status: 200
  },
  {
    from: '/api/*',
    to: '/.netlify/functions/___netlify-handler',
    status: 200
  },
  {
    from: '/Infoicon.png',
    to: '/Infoicon.png',
    conditions: { Cookie: [Array] },
    status: 200
  },
  {
    from: '/QRCode.png',
    to: '/QRCode.png',
    conditions: { Cookie: [Array] },
    status: 200
  },
  {
    from: '/back.png',
    to: '/back.png',
    conditions: { Cookie: [Array] },
    status: 200
  },
  {
    from: '/btc.png',
    to: '/btc.png',
    conditions: { Cookie: [Array] },
    status: 200
  },
  {
    from: '/btc.svg',
    to: '/btc.svg',
    conditions: { Cookie: [Array] },
    status: 200
  },
  {
    from: '/callmade.png',
    to: '/callmade.png',
    conditions: { Cookie: [Array] },
    status: 200
  },
  {
    from: '/callreceived.png',
    to: '/callreceived.png',
    conditions: { Cookie: [Array] },
    status: 200
  },
  {
    from: '/down.js',
    to: '/down.js',
    conditions: { Cookie: [Array] },
    status: 200
  },
  {
    from: '/down.png',
    to: '/down.png',
    conditions: { Cookie: [Array] },
    status: 200
  },
  {
    from: '/eyehide.png',
    to: '/eyehide.png',
    conditions: { Cookie: [Array] },
    status: 200
  },
  {
    from: '/eyeshow.png',
    to: '/eyeshow.png',
    conditions: { Cookie: [Array] },
    status: 200
  },
  {
    from: '/favicon.ico',
    to: '/favicon.ico',
    conditions: { Cookie: [Array] },
    status: 200
  },
  {
    from: '/plus_icon.svg',
    to: '/plus_icon.svg',
    conditions: { Cookie: [Array] },
    status: 200
  },
  {
    from: '/search.js',
    to: '/search.js',
    conditions: { Cookie: [Array] },
    status: 200
  },
  {
    from: '/search.png',
    to: '/search.png',
    conditions: { Cookie: [Array] },
    status: 200
  },
  {
    from: '/vercel.svg',
    to: '/vercel.svg',
    conditions: { Cookie: [Array] },
    status: 200
  },
  {
    from: '/zelta.png',
    to: '/zelta.png',
    conditions: { Cookie: [Array] },
    status: 200
  },
  {
    from: '/Order Book/orderbook-buy.svg',
    to: '/Order Book/orderbook-buy.svg',
    conditions: { Cookie: [Array] },
    status: 200
  },
  {
    from: '/Order Book/orderbook-icon.svg',
    to: '/Order Book/orderbook-icon.svg',
    conditions: { Cookie: [Array] },
    status: 200
  },
  {
    from: '/Order Book/orderbook-sell.svg',
    to: '/Order Book/orderbook-sell.svg',
    conditions: { Cookie: [Array] },
    status: 200
  },
  
  ... 324 more items
].

(@netlify/plugin-nextjs onBuild completed in 1.2s)

────────────────────────────────────────────────────────────────
  4. Functions bundling                                         
────────────────────────────────────────────────────────────────

Packaging Functions from .netlify/functions-internal directory:
 - ___netlify-handler/___netlify-handler.js
 - ___netlify-odb-handler/___netlify-odb-handler.js
 - _ipx/_ipx.js

(Functions bundling completed in 37.8s)

────────────────────────────────────────────────────────────────
  5. @netlify/plugin-nextjs (onPostBuild event)                 
────────────────────────────────────────────────────────────────

Next.js cache saved.

(@netlify/plugin-nextjs onPostBuild completed in 792ms)

────────────────────────────────────────────────────────────────
  Netlify Build Complete                                        
────────────────────────────────────────────────────────────────

(Netlify Build completed in 1m 38.7s)
Deploy path:        <redacted>/Zelta/.next
Configuration path:  <redacted>/Zelta/netlify.toml

gem-ns · February 9, 2022, 4:23am

Downgrading to 4.2.3 doesn’t help in our case to resolve the 500 IPX Error - https://zelta-fe-uat.netlify.app/
I forgot to add one thing. If you notice, this is happening with some of the images. Few of them get served fine, but few of them error out.

 Loading plugins
   - @netlify/plugin-nextjs@4.2.3 from netlify.toml and package.json

❯ Outdated plugins
   - @netlify/plugin-nextjs@4.2.3: latest version is 4.2.5
     Migration guide: https://ntl.fyi/next-plugin-migration
     To upgrade this plugin, please update its version in "package.json"

hillary · February 9, 2022, 3:18pm

Hey folks! Thanks for your patience here. I have looped in our Support team and we are looking into this for you. Stay tuned to this thread!

hillary · February 9, 2022, 4:25pm

@Skuut and @chrisjordan7, can you share your site URL, your build logs, and your project repo?

gem-ns · February 10, 2022, 12:11pm

Do we have any update on this @hillary

hillary · February 10, 2022, 4:27pm

Hey there, @gem-ns

Thanks for your patience as we investigate this. Can you link to your deploy logs where you are using 4.2.3 and 4.2.5? Or you can share the deploy ID where you were using this. This will help us look into the specific details.

gem-ns · February 10, 2022, 4:50pm

The logs are pretty much the same for both the versions. @hillary
Actually, I am deploying using the netlify-cli. Is there anything I can do to share the relevant information?

gem-ns · February 12, 2022, 12:47pm

@hillary Is there something else I can do to help you debug?

gem-ns · February 13, 2022, 11:16am

Hey,
I managed to resolve the problem on my own with some debugging. These are the details:

tldr: Do not build and deploy your website from a Mac. Build website either directly on netlify or on a Linux machine and then deploy.

I checked that our images was appearing fine on one of our old deployments which had @netlify/plugin-nextjs@4.1.1.
So, the first thing I did was to change the package version on our latest branch to 4.1.1.
I did the local deployment again. This time the images errored out again but with a 502 error. And when I checked the network tab, it said something like “darwin is not compatible with the sharp library or so, please build using linux”.
I quickly realized that this might be due to me building the website locally on my Mac. So, I tried a deployment on our CI/CD pipeline which uses Linux.
Guess what, the images appeared back now!

I hope this helps everyone. Thanks for your prompt responses @hillary!

marfin-lab · February 14, 2022, 3:55pm

wtf ! i had the same problem in my mac OS deploys. I cant test in other OS. But, it seems that you had the same problem that i had. I’ve changed the image component to not receive. I cant imagine that problem is my macOS lol

hillary · February 17, 2022, 10:51pm

Hey there, @gem-ns

Thanks for confirming everything is working now! Great to hear!

@marfin-lab, are you still encountering issues? If you are, can you please share:

A link to your site
Your project repo
Your most recent deploy log
The debugging steps you have taken

Thanks!

jpizzle34 · February 21, 2022, 7:03am

Hi all,

Just in case this helps anyone else not on macOS:

I had a similar problem when recently upgrading to next@12.1.0 and netlify/plugin-nextjs@4.2.7 from 4.2.5 on linux. Both statically imported images and dynamic images from a cms weren’t loading. I’m not using a custom CI/CD pipeline, just the default github integration.

After clearing the netlify cache and redeploying, images were loading fine.

hillary · February 21, 2022, 8:39pm

Hey there, @jpizzle34

Thanks so much for reaching out and sharing those steps! They will definitely be beneficial for additional Forums members.

Happy building

Topic		Replies	Views
Failed to load _ipx/ url when using @next/image Support nextjs	5	1218	October 16, 2022
IPX Error 500 on Nextjs Images with Cloudinary Support nextjs	5	549	May 29, 2022
Problems with deploy and NextJs Support nextjs	1	222	June 22, 2023
Next/image sporadically fails to load local images Support nextjs	8	985	August 18, 2022
NextJS site returning 500 since netlify.toml Support nextjs	7	621	April 28, 2023

Netlify Next.js images throw IPX Error 500

Related topics