問題タブ [nextjs-image]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票する
1 に答える
1146 参照

css - CSS Grid Full Bleed Layout で動作する `next/image` を取得しますか?

このチュートリアルに従おうとしています。

TL;DR は次のとおりです。

ブラウザーの端に向かって画像がにじみ出る、Medium のようなデザインに従います。

またfull-bleed、Image のクラスがあります。

next/imageこの種のもので自分の作品を作る方法が本当にわかりませんか?

私のImg.tsxファイルは次のようになります。

そして、私のようにcomponents/mdx/index.ts見えます:

私の.mdxファイルには、上記のように component を使用する通常の HTMLimgタグが含まれていImgます (これは内部的に を使用しますnext/image)。

高さがない場合、フルブリード レイアウトを取得するにはどうすればよいですか? layout="fill"仕事もまともにできない。画像を重ねるだけです。

何か案は?

0 投票する
2 に答える
7660 参照

image - NextJS 画像コンポーネントと画像最適化が機能しない

私はNextJSが初めてです。NextJS のドキュメントでこの新しい画像最適化機能を見たのですが、うまくいきません。

これが私のコードです。動作する部分と動作しない部分をコードで指定します。

私が得ているエラーはこれです:

誰でもこの問題を解決するのを手伝ってもらえますか?

0 投票する
1 に答える
207 参照

javascript - 次の Js v10 レンダリング イメージ

最近、Next.js バージョン 10 がリリースされ、最新のImage要素が追加されました。これは、画像の多い Web サイトにとって非常に役立ちます。

サーバーから次のような HTML 応答を受け取ります。

私がやりたいことは、HTML をプレーン テキストにレンダリングし、ページでのレンダリング中にすべてのimgタグをに変換することだけです。すべてをImageに置き換えるにはどうすればよいですか?imgImage

0 投票する
3 に答える
14032 参照

next.js - How to use Tailwind CSS with Next.js Image

I am trying to use Tailwind CSS in an Next.js project but I cant't use my Tailwind classes with Next.js Image component.

Here's my code:

#xA;

I want to use Tailwind classes instead of the height and width property of the Next.js Image. But I can't because it throws me an error. Also, unsized property throws another error saying it's deprecated. Is there any solution?

Here is the error if I don't use the height and width property. enter image description here

When I use the layout='fill' property it shows only one picture. And if I use the unsized property, then the following error is shown.

enter image description here