IPX Provider

Self hosted image provider

Nuxt Image comes with a preconfigured instance of ipx. An open source, self-hosted image optimizer based on sharp.

Using ipx in production

Use IPX for self-hosting as an alternative to use service providers for production.

You don't need to follow this section if using target: 'static'.

Runtime Module

Just add @nuxt/image to modules (instead of buildModules) in nuxt.config. This will ensure that the /_ipx endpoint continues to work in production.

Alternative: serverMiddleware

If you have an advanced use case, you may instead create a custom server middleware that handles the /_ipx endpoint:

  1. Add ipx as a dependency:
yarn add ipx
npm install ipx
  1. Create server/middleware/ipx.js:
server/middleware/ipx.js
import { createIPX, createIPXMiddleware } from 'ipx'

// https://github.com/unjs/ipx
const ipx = createIPX(/* options */)

export default createIPXMiddleware(ipx)
  1. Add /_ipx to serverMiddleware:
nuxt.config.js
export default {
  serverMiddleware: {
    '/_ipx': '~/server/middleware/ipx.js'
  }
}