简体   繁体   English

Nextjs 打字稿图像占位符

[英]Nextjs Typescript Image placeholder

I am using Nextjs with typescript.我正在使用带有打字稿的 Nextjs。 I am trying to use the image component with the placeholder prop.我正在尝试将图像组件与占位符道具一起使用。 But I keep on getting an error.但我不断收到错误消息。

在此处输入图片说明

My code >我的代码 >

import bgSell from '../../public/assets/bgSell.jpg';

 <Image
    layout="fill"
    src={bgSell}
    className="z-0 absolute top-0 left-0 min-h-full min-w-full object-cover"
    placeholder="blur"
 />

I think I need to do some configuration in webpack maybe?我想我需要在 webpack 中做一些配置吗?

I checkout their git repo example and everything works fine but they are using javascript.我查看了他们的 git repo 示例,一切正常,但他们使用的是 javascript。

Here is the link of the example from next.js这是 next.js 示例的链接

https://github.com/vercel/next.js/blob/canary/examples/image-component/pages/placeholder.js https://github.com/vercel/next.js/blob/canary/examples/image-component/pages/placeholder.js

Any help would be awesome!任何帮助都是极好的!

Yeap I found the issue.是的,我发现了这个问题。 I was using nextjs version 10. I upgraded my version to 11 and everything works fine now :)我使用的是 nextjs 版本 10。我将版本升级到 11,现在一切正常:)

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM