我正在尝试使用Next.js next/future/image
实验组件。
我将package.json
中的Next.js版本升级到了"next": "^12.2.0"
。
下面是我的next.config.js
文件:
/** @type {import('next').NextConfig} */
const nextConfig = {
strictMode: true,
experimental: {
images: {
allowFutureImage: true,
},
},
images: {
domains: ['firebasestorage.googleapis.com',],
},
};
module.exports = nextConfig;
它不允许我使用此功能。以下是浏览器控制台中的错误消息: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.
3条答案
按热度按时间6ie5vjzr1#
对于下一个v13用户:
我相信
next/future/image
现在是默认的Image
组件。所以不需要额外的工作!只需导入并使用适用于Next v12.3用户(如本问题的作者)
你不需要在配置中添加任何东西来使用
future/image
。未来的映像现在是稳定的。只需通过导入直接使用它事实上,在config中添加
images
属性会导致错误,因为config模式已经更新了。所以不要这样做。pwuypxnk2#
对我有效的解决方案是添加实验性规则,停止nextjs服务器并重新启动它。
vmpqdwk33#
我目前使用的是NextJS 12.3.1版本,如果我在next.config.js中启用它,那么我会在终端上收到一个难看的警告。所以最好只使用
import Image from "next/future/image"
,而不添加配置,以避免警告。希望其他使用12.3.1的人会发现这一点有用(使用future/image可以去掉围绕的讨厌的 Package 器div/span)配置到位时看到的警告: