Следующая оптимизация изображения JS

#javascript #reactjs #next.js #nextjs-image

#javascript #reactjs #next.js #nextjs-image

Вопрос:

Как я могу использовать Image элемент NextJS в необработанном HTML-ответе с сервера что-то вроде:

 HTML =
"<div>
<p> Some Random text</p>
<img src="image1.jpg" />
<img src="image2.jpg" />
<p> Some Random text</p>
<img src="image3.jpg" />
<img src="image4.jpg" />
<div>"
 

Ответ №1:

The Next.js Image элемент является компонентом React, поэтому его можно использовать только в React (с Next.js ).

 export default function Page() {
   return (
      <Image src="/image.png" layout="fill" />
   )
}
 

Если вы хотите оптимизировать изображения только с помощью необработанного HTML, я бы рекомендовал установить ImgBot в репозиторий GitHub, и он оптимизирует изображения для вас и сохранит их в файле.