Nuxt3部署Github Pages遇nuxt-svgo报错：createElement执行失败

问题本质 #

报错是因为SVG的完整URL被当作HTML标签名解析，而非资源路径。核心原因是路径配置错误或SVG引入方式不规范，导致Nuxt生成的HTML代码异常。

解决步骤 #

• 修正Nuxt配置文件（nuxt.config.ts）
  确保app.baseURL和buildAssetsDir匹配你的部署环境：

  export default defineNuxtConfig({
    app: {
      // 自定义域名填'/'；仓库页（如xxx.github.io/repo）填'/repo/'
      baseURL: '/',
      buildAssetsDir: '_nuxt' // 保持与生成的静态资源目录一致，默认即为_nuxt
    }
  })
  

• 规范SVG引入方式
  避免硬编码完整URL，改用Nuxt支持的静态资源引用方式：

  <template>
    <!-- 方式1：直接用相对路径 -->
    <img src="~/assets/logo.svg" alt="站点Logo" />
    <!-- 方式2：用useAsset方法获取正确路径 -->
    <img :src="logoPath" alt="站点Logo" />
  </template>
  
  <script setup>
  const logoPath = useAsset('~/assets/logo.svg')
  </script>
  

• 重新构建部署
  执行npm run generate重新生成静态文件，推送最新产物到Github Pages对应的分支（通常是gh-pages）。

• 检查Github Pages部署设置
  确认部署分支正确，自定义域名已在Github Pages设置中启用，DNS解析无问题。

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