Nuxt 3切换Vite与@nuxt/image后图片加载异常，求配置方案

针对你切换后的配置问题，核心是Vite的base配置与Nuxt Image的路径处理需要适配，以下是具体调整方案：

问题根源 #

Webpack的build.extend中publicPath和Vite的base虽作用类似，但资源路径解析逻辑存在差异；同时@nuxt/image正式版相较于edge版，对CDN路径的自动推导更严格，需明确配置图片资源的基础路径。

调整后的nuxt.config.ts配置 #

export default defineNuxtConfig({
  modules: ['@nuxt/image'],
  image: {
    provider: "ipx",
    domains: [cdnMinUrl],
    // 新增cdnURL，指定图片资源的CDN基础路径
    cdnURL: `${cdnUrl}xonuxt/_nuxt/`,
    ipx: {
      baseURL: `${baseUrl}_ipx`,
    },
  },
  vite: {
    base: `${cdnUrl}xonuxt/_nuxt/`,
  },
})

额外排查步骤 #

• 执行npx nuxt clean清除旧构建缓存，再重新运行nuxt build或nuxt dev
• 查看浏览器控制台的图片请求URL，确认是否为预期的CDN路径+IPX处理路径，若路径拼接错误，需调整cdnURL或ipx.baseURL的格式（注意结尾是否带斜杠）
• 确认cdnMinUrl和baseUrl变量已正确注入，无未解析的模板字符串问题

内容的提问来源于stack exchange，提问作者konsav