Установка модуля картинок в Nuxt
Компонент для оптимизированных
картинок поставляется отдельным
модулем @nuxt/image.
Его нужно один раз добавить
в учебный или рабочий проект,
чтобы Nuxt зарегистрировал
компонент и серверную обработку
файлов при npm run dev
и npm run build.
В Nuxt 4 для этого есть команда,
которая ставит пакет и прописывает
модуль в конфиге. Выполним её
в корне проекта my-app:
npx nuxt module add image
После установки в nuxt.config.ts
появится массив modules
с подключённым пакетом. Минимальный
фрагмент конфигурации выглядит так:
export default defineNuxtConfig({
modules: ['@nuxt/image'],
});
Если в проекте уже были другие
модули, команда допишет
@nuxt/image в тот же массив,
не затирая остальные записи.
Перезапуск npm run dev
подхватит изменения: без строки
в modules компонент модуля
в шаблоне не заработает.
Подключите модуль картинок
в проекте my-app
официальной командой Nuxt CLI.
Проверьте, что после установки
в nuxt.config.ts
в массиве modules
есть запись @nuxt/image,
и снова запустите режим разработки.