빌드 시 정적(static) 이미지가 누락되는 문제

Problem

• Error: Image import ... is not a valid image file. The image may be corrupted or an unsupported format.
• build 되는 과정에서 public 폴더 안에 있는 static 이미지가 누락되는 문제

 

Reason

• Disable Static Imports
• disableStaticImages 속성이 true로 되어 있어서 정적 이미지를 가져올 수 없었던 걸로 추측됨

 

Try to solve

invalid-images-config | Next.js

invalid-images-config | Next.js

https://github.com/vercel/next.js/issues/44012

Error: Image import ... is not a valid image file. The image may be corrupted or an unsupported format. · Issue #44012 · verce

 

• config 변경 및 추가

images: {
    deviceSizes: [640, 750, 828, 1080, 1200, 1920, 2048, 3840],
    imageSizes: [16, 32, 48, 64, 96, 128, 256, 384],
    domains: [],
    path: '/_next/image',
    loader: 'default',
    loaderFile: '',
    disableStaticImages: false,
    minimumCacheTTL: 60,
    formats: ['image/webp'],
    dangerouslyAllowSVG: false,
    contentSecurityPolicy: "default-src 'self'; script-src 'none'; sandbox;",
    contentDispositionType: 'inline',
    remotePatterns: [],
    unoptimized: false,
  },