http://localhost:3000/_ipx/_/img/blog.jpg 404 (IPX_FILE_NOT_FOUND)

[Edwin-WB-Li]

Does anyone know, how to solve this problem? During my use of NuxtImg, the picture shows a 404

My image file is located at public/img

node v22.5.0

window operating system

<nuxt-img src="/img/blog.jpg" class="w-full" alt="blog"> </nuxt-img>

nuxt.config.ts:

import { defineNuxtConfig } from 'nuxt/config'
import { seoData } from './src/data'

const { NUXT_PUBLIC_UMAMI_HOST, NUXT_PUBLIC_UMAMI_ID, NUXT_PUBLIC_UMAMI_DOMAINS } = process.env

// https://nuxt.com/docs/api/configuration/nuxt-config
export default defineNuxtConfig({
  compatibilityDate: '2025-08-06',
  srcDir: 'src',
  modules: [
    'nuxt-icon',
    '@nuxt/image',
    '@nuxt/fonts',
    '@nuxtjs/i18n',
    '@nuxt/eslint',
    '@vueuse/nuxt',
    '@nuxtjs/robots',
    '@nuxtjs/sitemap',
    'nuxt-og-image',
    'nuxt-umami',
    '@nuxt/content',
    '@nuxtjs/color-mode',
    '@nuxtjs/tailwindcss',
    '@formkit/auto-animate',
    '@stefanobartoletti/nuxt-social-share',
  ],

  runtimeConfig: {
    public: {
      umamiApi: '',
      umamiApiKey: '',
      umami: {
        // https://umami.nuxt.dev/getting-started/introduction
        id: NUXT_PUBLIC_UMAMI_ID,
        host: NUXT_PUBLIC_UMAMI_HOST,
        autoTrack: true,
        useDirective: true,
        domains: NUXT_PUBLIC_UMAMI_DOMAINS?.split(',') ?? [],
        ignoreLocalhost: true,
      },
    },
  },

  image: {
    domains: ['localhost'], // 允许本地域名
    // staticFilename: '/public/[path]/[name][ext]', // 指定静态文件路径
    dir: 'public',
  },
  app: {
    head: {
      charset: 'utf-16',
      viewport: 'width=device-width,initial-scale=1',
      title: seoData.title,
      titleTemplate: `%s - ${seoData.title}`,
    },
    pageTransition: { name: 'page', mode: 'out-in' },
    layoutTransition: { name: 'layout', mode: 'out-in' },
  },

  sitemap: {
    sources: [seoData.mySite],
  },

  site: {
    url: seoData.mySite,
    name: 'Al Asad Nur Riyad',
  },

  typescript: {
    strict: true,
  },

  nitro: {
    prerender: {
      crawlLinks: true,
      routes: ['/', '/rss.xml'],
    },
  },

  i18n: {
    // langDir: '~/i18n/locales/', // 动态解析路径,
    defaultLocale: 'zh',
    locales: [
      { code: 'en', name: 'English', file: 'en.json' },
      { code: 'zh', name: '简体中文', file: 'zh-CN.json' },
    ],
    detectBrowserLanguage: {
      // 自动检测浏览器语言
      useCookie: true,
      cookieKey: 'nuxt-language',
    },
    strategy: 'no_prefix',
  },

  colorMode: {
    classSuffix: '',
    preference: 'dark',
    fallback: 'light',
  },

  content: {
    build: {
      markdown: {
        highlight: {
          theme: {
            default: 'dracula',
            dark: 'vitesse-light',
          },
        },
      },
    },
  },
})

package.json:

{
  "name": "nuxt-blog",
  "version": "1.0.0",
  "private": true,
  "license": "MIT",
  "type": "module",
  "scripts": {
    "build": "nuxt build",
    "dev": "nuxt dev",
    "format": "prettier --check ./",
    "generate": "nuxt generate",
    "postinstall": "nuxt prepare",
    "lint": "eslint .",
    "lint:fix": "eslint . --fix",
    "lint:format": "prettier --write ./",
    "lint:staged": "lint-staged",
    "prepare": "husky",
    "preview": "nuxt preview"
  },
  "dependencies": {
    "@giscus/vue": "^3.1.1",
    "@nuxt/content": "^3.3.0",
    "@nuxt/fonts": "^0.11.4",
    "@nuxt/image": "^1.10.0",
    "@nuxtjs/color-mode": "^3.3.2",
    "@nuxtjs/i18n": "^10.0.3",
    "@vueuse/core": "^13.3.0",
    "@vueuse/nuxt": "^13.3.0",
    "better-sqlite3": "^12.2.0",
    "feed": "^4.2.2",
    "fuse.js": "^7.0.0",
    "nuxt": "^3.17.4",
    "nuxt-icon": "^0.6.8",
    "nuxt-umami": "^3.2.0"
  },
  "devDependencies": {
    "@commitlint/cli": "^19.8.1",
    "@commitlint/config-conventional": "^19.8.1",
    "@formkit/auto-animate": "^0.8.2",
    "@nuxt/eslint": "^1.4.1",
    "@nuxtjs/robots": "^5.2.6",
    "@nuxtjs/sitemap": "^7.2.7",
    "@nuxtjs/tailwindcss": "^6.11.4",
    "@stefanobartoletti/nuxt-social-share": "^0.6.1",
    "@tailwindcss/forms": "^0.5.7",
    "@tailwindcss/typography": "^0.5.16",
    "eslint-config-prettier": "^10.1.5",
    "husky": "^9.1.7",
    "lint-staged": "^16.1.2",
    "nuxt-og-image": "^5.0.2",
    "prettier": "^3.5.3",
    "prettier-plugin-packagejson": "^2.5.19",
    "prettier-plugin-tailwindcss": "^0.6.14",
    "typescript": "^5.8.2",
    "unenv": "^1.10.0"
  },
  "packageManager": "[email protected]",
  "pnpm": {
    "overrides": {
      "ipx": "^3.0.0"
    }
  }
}