Skip to content

Conversation

@renovate
Copy link
Contributor

@renovate renovate bot commented Nov 5, 2025

This PR contains the following updates:

Package Change Age Confidence
@nuxt/image (source) ^0.7.1 -> ^2.0.0 age confidence

Release Notes

nuxt/image (@​nuxt/image)

v2.0.0

Compare Source

We're excited to announce Nuxt Image v2! 🎉 This release focuses on TypeScript support, performance improvements, and better developer experience.

👀 Highlights

[!NOTE]
Nuxt Image v2 requires Nuxt 3.1+. If you're on Nuxt 3.0.x, you'll need to upgrade to at least 3.1 first.

🎯 TypeScript support

The biggest change in v2 is full TypeScript support throughout the module (#​1802).

Typed providers

Image providers now use defineProvider for type-safe configuration:

// Before (v1)
export const getImage = (src, { modifiers, baseURL }) => {
  // ...
  return { url }
}

// After (v2)
import { defineProvider } from '@​nuxt/image/runtime'

export default defineProvider({
  getImage(src, { modifiers, baseURL }) {
    // Fully typed modifiers
    // ...
    return { url }
  }
})
Type-safe configuration

Module options are now fully typed. For example, providers that require a baseURL will enforce it at the type level in your nuxt.config.ts:

export default defineNuxtConfig({
  image: {
    provider: 'cloudinary',
    cloudinary: {
      baseURL: 'https://res.cloudinary.com/...' // TypeScript error if missing!
    }
  }
})
Typed composables

The $img helper and useImage() composable have full type inference (#​1844):

const img = useImage()

// Full autocomplete for modifiers
const url = img('/image.jpg', { 
  width: 300,
  height: 200,
  fit: 'cover' // TypeScript knows the valid values!
})
🚀 IPX v3

We've upgraded to IPX v3 (#​1799) for better performance and better sharp binary handling. The upgrade includes automatic detection of the correct sharp binaries for your deployment architecture.

🔌 Server-side utilities

You can now use image helpers directly in Nitro server endpoints (#​1473).

// server/api/og-image.ts
export default defineEventHandler((event) => {
  const img = useImage()
  
  return {
    url: img('/hero.jpg', { 
      width: 1200, 
      height: 630,
      fit: 'cover' 
    })
  }
})
🎨 Component improvements
Template refs

<NuxtImg> now exposes the underlying <img> element via template refs:

<template>
  <NuxtImg ref="imgEl" src="/image.jpg" />
</template>

<script setup>
const imgEl = ref()

onMounted(() => {
  // Direct access to the native img element
  console.log(imgEl.value)
})
</script>
Typed slots

Both <NuxtImg> and <NuxtPicture> now have properly typed default slots.

🌐 New providers

We've added two new providers:

  • Shopify (#​1890) - for Shopify store images
  • GitHub (#​1990) - for GitHub avatars and user content
export default defineNuxtConfig({
  image: {
    provider: 'shopify',
    shopify: {
      baseURL: 'https://your-store.myshopify.com'
    }
  }
})
⚡ Performance

We've made several optimizations to reduce bundle size and improve runtime performance:

  • Better URL encoding (#​1813) - Switched to URLSearchParams for more reliable parameter handling
  • Reduced runtime utilities (#​1816) - Removed unused code and simplified implementations
  • Streamlined screen sizes (#​1931) - Aligned default breakpoints with Tailwind CSS
🎯 Better layer support

Nuxt Image now properly supports custom image directories within Nuxt layers (#​1880), making it easier to organize images in modular projects.

⚠️ Breaking changes
Provider API

The biggest breaking change is how providers are defined. All providers now use a default export with the defineProvider wrapper:

- export const getImage = (src, { modifiers }) => { ... }
+ export default defineProvider({
+   name: 'my-provider',
+   getImage(src, { modifiers }) { ... }
+ })

If you maintain a custom provider, you'll need to update it. But you get full TypeScript support in return!

Removed providers

The deprecated layer0 and edgio providers have been removed.

URL formatters

If you have custom providers using joinWith for parameter formatting, you'll need to update them to use the formatter function with createOperationsGenerator. See the migration guide for details.


#### Screen sizes

Default screen sizes now match Tailwind CSS. We've removed `xs` (320px) and `xxl` (2560px). See the [migration guide](https://image.nuxt.com/getting-started/migration#screen-size-changes) for how to add them back if needed.
Removed utilities

We've removed several unused runtime utilities. If you were importing internal utilities directly, check if they still exist.

✅ Upgrading

Check out our comprehensive migration guide for step-by-step upgrade instructions.

The quick version:

npm install @&#8203;nuxt/image@latest

Most apps can upgrade with no code changes. If you have custom providers, you'll need to update them to use defineProvider - see the migration guide for examples.

🐛 Bug fixes

This release includes several fixes:

  • Preload links: Fixed preload for multiple densities with single size (#​1851)
  • Crossorigin attributes: Correct crossorigin on preload links (#​1836)
  • Provider-specific formats: AWS Amplify and Vercel providers now have proper format allow lists (#​1996)
  • Hygraph: Prevented broken image URLs (#​1999)
  • Preset sizes: Fixed preset size application when component sizes prop is undefined (#​1919)
  • Cloudflare: Don't add baseURL if there are no operations (#​1790)
  • IPX: Always use IPX provider if external baseURL is provided (#​1800)
🙏 Thank you

Thank you to all the contributors who made this release possible! This includes contributions from dozens of community members who helped with features, bug fixes, documentation improvements, and feedback.

👉 Changelog

compare changes

🚀 Enhancements
  • Add support for image helpers in nitro endpoints (#​1473)
  • deps: Upgrade to ipx v3 (#​1799)
  • ipx: Log the architecture of the build (#​1808)
  • ⚠️ Typed providers + modifiers (#​1802)
  • Add type for default nuxt-picture slots (0e4f174)
  • nuxt-img: Add types for default slot (c4bba1b)
  • Add shopify provider (#​1890)
  • Add support for image helpers in nitro endpoints (#​1473)
  • ipx: Log the architecture of the build (#​1808)
  • cloudimage: Make baseURL optional with cdn (#​1951)
  • github: Add provider for github avatars (#​1990)
  • nuxt-img: Expose element (#​1834)
  • Support custom image dirs within layers (#​1880)
  • Strongly type $Img/useImage methods (#​1844)
  • Add type hints for provider option (64c76ee)
🔥 Performance
  • nuxt-img: Call decode before swapping from placeholder (#​2008)
🩹 Fixes
  • Remove layer0 and edgio providers (#​1763)
  • Add back layer0 and edgio providers (without) tests (fee826c)
  • cloudflare: Don't add baseURL if there are no operations (#​1790)
  • ipx: Always use ipx provider if external baseURL is provided (#​1800)
  • ipxStatic: Strip repeated slashes from image path (#​1801)
  • edgio,layer0: ⚠️ Remove providers (#​1809)
  • ⚠️ Use URLSearchParams as default formatter (#​1813)
  • nuxt-picture: Export DefaultSlotProps (891d79a)
  • aliyun: Explicitly import useRuntimeConfig (268eb9c)
  • Remove layer0 and edgio providers (#​1763)
  • Add back layer0 and edgio providers (without) tests (a99ce09)
  • cloudflare: Don't add baseURL if there are no operations (#​1790)
  • ipx: Always use ipx provider if external baseURL is provided (#​1800)
  • ipxStatic: Strip repeated slashes from image path (#​1801)
  • Avoid deep type instantiation (12b37a2)
  • Add types to new node + shared contexts (#​1907)
  • nuxt-img: Correct preload link for multiple densities + single size (#​1851)
  • nuxt-img: Add appropriate crossorigin attribute to preload link (#​1836)
  • awsAmplify,vercel: Set allow list of formats for providers (#​1996)
  • hygraph: Prevent broken image urls (#​1999)
  • nuxt-img: Apply preset sizes when component sizes prop is undefined (#​1919)
💅 Refactors
  • ⚠️ Remove unused runtime utilities and simplify code (#​1816)
  • ⚠️ Remove xs and xxl screen sizes (#​1931)
📖 Documentation
  • Fix typo (#​1762)
  • Fix link to runtime/providers (#​1819)
  • Refactor to use docus v3 (#​1868)
  • Put back social card (#​1870)
  • Fix typo (#​1762)
  • Fix link to runtime/providers (#​1819)
  • Add back plausible for stats (42cbf6f)
  • deps: Upgrade to docus v4 (#​1916)
  • Update README, add section for how to install (#​1929)
  • Use nuxt rather than nuxi (809e726)
  • Fix getImage in the example of custom provider (#​1949)
  • Fix components source file link (#​1955)
  • Upgrade to docus v5 (#​1975)
  • Add example for densities prop usage (#​1937)
  • Adjust grammar and improve clarity in providers page (#​1945)
  • Explain how to configure ipx at runtime (#​1738)
  • Add none provider documentation (#​2002)
  • Fix link to css file (f87793f)
  • Add baseURL to bunny example (3654b3e)
📦 Build
  • Pull in types from index (533b927)
  • Update ambient type hint (62998ab)
🏡 Chore
  • Disable shamefully-hoist (#​1795)
  • Do not ignore typescript upgrades (9421fa5)
  • Switch to using typesVersions field (aa39ef4)
  • Allow major bumps in changelog (3989629)
  • Prefer nuxt over nuxi (#​1857)
  • Test against node 20 (5507c0d)
  • Disable shamefully-hoist (#​1795)
  • Do not ignore typescript upgrades (0809991)
  • Switch to using typesVersions field (b4af05a)
  • Allow major bumps in changelog (d486587)
  • Enable oxc-resolver build (4be31c7)
  • Release v1.11.0 (3123997)
  • config: Migrate renovate config (#​1906)
  • Add plausible to knip (a988f40)
  • Add verifyDepsBeforeRun: install (#​2000)
  • Remove .npmrc (578c04b)
  • Update redirected URL (#​2006)
✅ Tests
  • Exclude layer0 + edgio from unit tests (ffe2177)
  • Add size snapshot (#​1815)
  • Bump timeout (6fe8401)
  • Skip bundle size tests in ecosystem ci (301c504)
  • Explicitly import runtime utils (0c729e2)
  • Migrate to vitest projects (0fc2980)
  • Exclude layer0 + edgio from unit tests (3682a90)
  • Add 3x retries for e2e tests (cfdf83a)
  • Add snapshots for image/picture rendering without sizes (b4b8b0e)
🤖 CI
  • Add release workflow and add pkg.pr.new (#​1791)
  • Set fetch-depth (ec565cd)
  • Remove forced corepack installation (86dc4a6)
  • Run tests against 1.x branch (0c83646)
  • Add release workflow and add pkg.pr.new (#​1791)
  • Set fetch-depth (18ae6c7)
  • Test vs node 20 (e6babef)
  • Run tests on last node LTS (fa391c5)
  • Use npm trusted publishing (49ad2b7)
  • Add provenance action to check for downgrades in provenance (7edc44a)
  • Always release on pkg.pr.new (30eb4a3)
  • Use push of tag as release trigger (195cec0)
⚠️ Breaking Changes
  • ⚠️ Typed providers + modifiers (#​1802)
  • edgio,layer0: ⚠️ Remove providers (#​1809)
  • ⚠️ Use URLSearchParams as default formatter (#​1813)
  • ⚠️ Remove unused runtime utilities and simplify code (#​1816)
  • ⚠️ Remove xs and xxl screen sizes (#​1931)
❤️ Contributors

v1.11.0

Compare Source

compare changes

🚀 Enhancements
  • Add support for image helpers in nitro endpoints (#​1473)
  • ipx: Log the architecture of the build (#​1808)
🩹 Fixes
  • Remove layer0 and edgio providers (#​1763)
  • Add back layer0 and edgio providers (without) tests (a99ce09)
  • cloudflare: Don't add baseURL if there are no operations (#​1790)
  • ipx: Always use ipx provider if external baseURL is provided (#​1800)
  • ipxStatic: Strip repeated slashes from image path (#​1801)
  • Avoid deep type instantiation (12b37a2)
📖 Documentation
🏡 Chore
  • Disable shamefully-hoist (#​1795)
  • Do not ignore typescript upgrades (0809991)
  • Switch to using typesVersions field (b4af05a)
  • Allow major bumps in changelog (d486587)
  • Enable oxc-resolver build (4be31c7)
  • Release v1.11.0 (3123997)
✅ Tests
  • Exclude layer0 + edgio from unit tests (3682a90)
🤖 CI
❤️ Contributors

v1.10.0

Compare Source

compare changes

🚀 Enhancements
  • imageengine: Add new modifiers (#​1701)
  • filerobot: Add new provider (#​1680)
🩹 Fixes
  • NuxtImg: Do not access props in template (e2e61fa)
  • NuxtPicture: Make img-attrs and attrs responsive (#​1696)
📖 Documentation
📦 Build
  • Update to latest nuxt/module-builder (#​1668)
🏡 Chore
  • Skip missing commit in generating changelog (a658787)
  • Revert to previous module builder (54dc469)
  • Remove unneeded .nuxtrc config (#​1708)
  • Temporarily ignore typescript upgrade (473f8f1)
  • Bump @nuxtjs/tailwindcss (25379fb)
  • Bump @nuxtjs/tailwindcss version (36fb95e)
🤖 CI
❤️ Contributors

v1.9.0

Compare Source

1.9.0 is the next minor release.

👉 Changelog

compare changes

🚀 Enhancements
  • nuxt-img: Add custom slot for full control of rendering (#​1626)
  • amplify: Add additional modifiers (#​1656)
  • strapi5: Add new provider with formats (#​1621)
🔥 Performance
  • Remove node-fetch-native dependency (d667025)
  • Use direct imports from #app/nuxt and #imports (70ef740)
🩹 Fixes
  • prismic: Use unsplash image proxy where necessary (#​1614)
  • Set up non-default ipx providers if options.ipx is set (#​1618)
  • Emit error events from <NuxtImg> placeholder (#​1640)
  • Add strapi5 to list of built-in providers (1079a03)
📖 Documentation
  • Update link to downloads count badge (392991b)
  • Improve cloudflare provider page (#​1601)
  • Make clearer that xxl is not a tailwind size (#​1632)
  • Add note about the alt prop (#​1628)
  • Capitalize title (#​1649)
  • Update strapi links (#​1650)
🏡 Chore
  • Update version link (fa18501)
  • docs: Remove unneeded icons config (150db3e)
  • Add knip and installed-check + clean up workspace deps (736102b)
  • Dedupe lockfile (ddc355b)
✅ Tests
  • Await file snapshot assertions (0e20cce)
  • Add strapi5 snapshots (3415daa)
🤖 CI
❤️ Contributors

v1.8.1

Compare Source

compare changes

🩹 Fixes
  • Suffix export of runtime utils with /index (#​1467)
  • vercel: Added missing formats config & improved documentation (#​1514)
📖 Documentation
  • Update link to downloads count badge (102d474)
🏡 Chore
  • Use tinyexec internally (3b9a4ea)
❤️ Contributors

v1.8.0

Compare Source

compare changes

🚀 Enhancements
  • cloudinary: Support reading project from absolute url (#​1361)
  • Provide runtimeConfig to getImage (#​1428)
🩹 Fixes
  • hygraph: New asset management support (#​1415)
  • Prevent hydration mismatch in <NuxtImg> (#​1445)
  • nuxt-picture: Check before accessing index (917242a)
  • Mark props as not required rather than default: undefined (#​1450)
  • Handle undefined indices more accurately (#​1451)
  • hygraph: Add back tests and refactor splitter (#​1452)
❤️ Contributors

v1.7.1

Compare Source

compare changes

🩹 Fixes
  • cloudinary: Map cover to lfill mode (#​1355)
  • Import runtime types from module entrypoint (#​1384)
  • Update to latest @nuxt/module-builder (#​1439)
  • Only add preload links on server (510e719)
  • weserv: Map rotate operation to ro (#​1441)
💅 Refactors
  • Convert <NuxtImg> to SFC (#​1435)
  • Convert <NuxtPicture> to SFC (#​1432)
  • Use more import.meta.* properties (#​1440)
📖 Documentation
🏡 Chore
❤️ Contributors

v1.7.0

Compare Source

compare changes

🚀 Enhancements
  • Allow specifying fetchpriority when preloading images (#​989)
🩹 Fixes
  • Ensure src comes after loading when rendering image (#​1338)
📖 Documentation
  • Fix typo in get-started/installation (#​1344)
🤖 CI
❤️ Contributors

v1.6.0

Compare Source

compare changes

🚀 Enhancements
  • Configure domains with NUXT_IMAGE_DOMAINS (#​1332)
  • nuxt-img: Add placeholderClass prop (#​1111)
🩹 Fixes
  • hygraph: Support new hygraph asset system (#​1321)
  • uploadcare: Omit base when resolved URL is returned (#​1254)
  • Handle undefined or empty image source values (#​1300)
  • Reduce warnings about density values > 2 (dad493a)
  • netlify: Normalise jpeg format to jpg (a59e57c)
📖 Documentation
  • Use new nuxi module add command in installation (#​1310)
  • Warn <NuxtPicture> doesn't support different sources (#​1326)
🏡 Chore
✅ Tests
❤️ Contributors

v1.5.0

Compare Source

compare changes

🚀 Enhancements
  • netlify: Support domains option with Netlify Image CDN (#​1287)
🩹 Fixes
  • Opt in to import.meta.* properties (#​1301)
  • Don't attempt to parse falsy values in options.domains (#​1305)
📖 Documentation
🏡 Chore
✅ Tests
  • Close out playwright page after each test (2b4bac9)
❤️ Contributors

v1.4.0

Compare Source

compare changes

🚀 Enhancements
  • Add performance feature detection markers (#​1221)
  • Support Netlify Image CDN (#​1234)
  • Add @error event from <NuxtPicture> (#​1252)
🩹 Fixes
  • ipx: Temporarily downgrade ipx/sharp (#​1265)
📖 Documentation
🏡 Chore
  • docs: Upgrade versions and add carbon ads (503b663)
  • Use explicit version to bust stackblitz cache (ae93934)
  • Assert event exists (8701991)
  • Pin vue for docs hotfix (b56c760)
  • Upgrade ipx/sharp separately (9a711e6)
  • Release @nuxt/image-nightly with changelogen (074d12e)
🤖 CI
❤️ Contributors

v1.3.0

Compare Source

compare changes

🚀 Enhancements
  • imagekit: Replace obsolete overlay syntax with layers (#​1197)
  • ipx: Support nuxt layers (#​1177)
🏡 Chore
  • Deduplicate vue versions in workspace (#​1202)
❤️ Contributors

v1.2.0

Compare Source

compare changes

🚀 Enhancements
🩹 Fixes
  • Add types to ipx provider options (#​1132)
📖 Documentation
  • Explain fall back to larger size on amplify + vercel (#​1124)
  • Add link back to sizes and mention TailwindCSS (6e41429)
  • Added deprecated message Netlify Large Media (#​1141)
  • Add bun installation command (#​1155)
🏡 Chore
  • Migrate to @nuxt/test-utils for runtime testing (#​1149)
  • Test bundler module resolution (#​1161)
❤️ Contributors

v1.1.0

Compare Source

compare changes

🚀 Enhancements
📖 Documentation
🏡 Chore
  • Add backquote in readme (7f8d8f2)
  • Add homepage to package.json (#​1097)
  • Use correct repository syntax (7a89e86)
  • Ensure amplify types respect upstream nitro types (5c4cd7c)
  • Add ignore (13a120f)
🤖 CI
❤️ Contributors

v1.0.0

Compare Source

compare changes

🩹 Fixes
  • cloudimage: Skip cdn when src path is provided with protocol (#​1028)
  • ipx: ⚠️ Pass all options (#​1056)
  • Type-only import of IPXRuntimeConfig (0b6bd83)
  • Autocomplete <NuxtImg> loading attribute (#​1057)
📖 Documentation
🏡 Chore
⚠️ Breaking Changes
  • ipx: ⚠️ Pass all options (#​1056)
❤️ Contributors

v0.7.2

Compare Source


Configuration

📅 Schedule: Branch creation - At any time (no schedule defined), Automerge - At any time (no schedule defined).

🚦 Automerge: Disabled by config. Please merge this manually once you are satisfied.

Rebasing: Whenever PR becomes conflicted, or you tick the rebase/retry checkbox.

🔕 Ignore: Close this PR and you won't be reminded about this update again.


  • If you want to rebase/retry this PR, check this box

This PR was generated by Mend Renovate. View the repository job log.

@coderabbitai
Copy link

coderabbitai bot commented Nov 5, 2025

Important

Review skipped

Bot user detected.

To trigger a single review, invoke the @coderabbitai review command.

You can disable this status message by setting the reviews.review_status to false in the CodeRabbit configuration file.


Comment @coderabbitai help to get the list of available commands and usage tips.

@renovate renovate bot force-pushed the renovate/nuxt-image-2.x branch from 6f46875 to bb04765 Compare November 10, 2025 19:57
@renovate renovate bot force-pushed the renovate/nuxt-image-2.x branch from bb04765 to 45ae409 Compare November 18, 2025 11:59
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant