How to enable NextJS "next/future/image"?

Viewed 1224

I am trying to use Next js experimental "next/future/image".

I upgraded the next version in package.json. to "next": "^12.2.0",

Here is my next.config.js file.

/** @type {import('next').NextConfig} */
const nextConfig = {
    strictMode: true,
    experimental: {
        images: {
            allowFutureImage: true,
        },
    },
    images: {
        domains: ['firebasestorage.googleapis.com',],
    },
};

module.exports = nextConfig;

It does not allow me to use this feature. Error on browser.

Error: The "next/future/image" component is experimental and may be subject to breaking changes. To enable this experiment, please include `experimental: { images: { allowFutureImage: true } }` in your next.config.js file.
1 Answers

The solution that worked for me was to add the experimental rule and stop the nextjs server and restart it. Then it would start working

module.exports = {
  experimental: {
    images: {
      allowFutureImage: true,
    },
  },
}
Related