@zhaogyna/vite-plugin

Vite 构建插件，为产物注入 debugId 并上传 SourceMap 到监控平台，实现生产环境错误堆栈还原。

安装

npm install -D @zhaogyna/vite-plugin

peerDependencies: vite >= 4.0.0

使用

// vite.config.ts
import { defineConfig } from 'vite'
import { monitorVitePlugin } from '@zhaogyna/vite-plugin'

export default defineConfig({
  plugins: [
    monitorVitePlugin({
      uploadUrl: 'https://monitor.example.com/api/sourcemap',
      project: 'my-app',
      authToken: 'your-auth-token',
      release: process.env.APP_VERSION,
      uploadSourceMaps: true,
    }),
  ],
})

配置项

| 选项 | 类型 | 默认值 | 说明 | |------|------|--------|------| | uploadUrl | string | - | Monitor 服务端 SourceMap 上传 URL | | project | string | - | 项目标识（用于服务端区分不同项目） | | authToken | string | - | 认证 Token，以 Authorization: Bearer <token> 方式发送 | | release | string | - | Release 版本号，需与 init({ release }) 一致 | | uploadSourceMaps | boolean | true | 是否上传 SourceMap 文件 |

工作原理

1. generateBundle 钩子：为每个 entry chunk 生成唯一 debugId（uuid4），在 JS 文件头部注入 //# debugId=<uuid> 注释
2. closeBundle 钩子：收集所有 SourceMap 文件，通过 multipart/form-data POST 上传到 uploadUrl，每个文件携带 debug_id、filename、project、release

上传失败不影响构建流程，仅 console.warn 提示。

注意事项

• 需要 Node.js 18+（使用内置 fetch）
• 确保 release 与 init({ release }) 中传入的值一致，否则 SourceMap 无法关联
• 建议在 CI 环境中通过环境变量传递 authToken，避免泄露

License

MIT