使用client-only时出现sourcemap源内容冲突错误的解决咨询

你遇到的本地运行正常但构建部署触发sourcemap冲突错误，可尝试以下几个解决方向：

1. 清理构建缓存 #

• 直接删除项目根目录下的node_modules/.cache、dist或.nuxt这类构建产物目录，再重新执行构建命令。
• 也可通过工具自带命令清理，比如Nuxt用npx nuxt clean，Vite用npx vite build --clearScreen false。

2. 调整Sourcemap配置 #

在项目构建配置文件（如nuxt.config.ts、vite.config.ts）里修改sourcemap生成策略：

• Nuxt项目：在build选项中关闭sourcemap或调整类型

  export default defineNuxtConfig({
    build: {
      sourcemap: false
    }
  })
  

• Vite项目：在build.sourcemap中设置为false或'hidden'

  export default defineConfig({
    build: {
      sourcemap: false
    }
  })
  

3. 检查Component2的代码逻辑 #

• 确认组件里没有重复导出、或在客户端/服务端环境下生成不同代码内容的情况，这类差异会引发sourcemap冲突。
• 确保对window的访问只在客户端生命周期钩子中（比如onMounted），不要放在组件初始化的顶级作用域：

  <script lang="ts">
  import { onMounted } from 'vue'
  
  export default defineComponent({
    setup() {
      onMounted(() => {
        // 在此处访问window对象
        console.log(window.innerWidth)
      })
    }
  })
  </script>
  

4. 统一文件编码与换行符 #

确保index.vue和component-2.vue的编码一致（如UTF-8），换行符也统一用LF或CRLF，避免因文件内容细微差异触发sourcemap冲突。

5. 升级核心依赖 #

检查Vue、Nuxt（如果用了）、Vite等核心依赖的版本，尝试升级到最新稳定版，部分旧版本存在sourcemap生成的已知bug。

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