I'm building a Nuxt 3 application (using Vue 3 and Vite as the default builder) and integrating Sentry for error monitoring with sourcemap uploads. My build artifacts are uploaded to a CDN (e.g., AWS S3 with CloudFront), and I serve the app's static assets from there (e.g., https://cdn.example.com/\_nuxt/app.abc123.js).
I'm using the @sentry/vite-plugin directly in my nuxt.config.ts to handle sourcemap uploads during nuxt build. However, I'm struggling to get the sourcemaps to match the CDN URLs in Sentry. Errors show minified stack traces, and the sourcemaps aren't applying because the file paths don't align.
// nuxt.config.ts
import { sentryVitePlugin } from '@sentry/vite-plugin'
import { defineNuxtConfig } from 'nuxt/config'
export default defineNuxtConfig({
// ... other config
vite: {
plugins: [
sentryVitePlugin({
org: 'my-org',
project: 'my-project',
authToken: process.env.SENTRY_AUTH_TOKEN,
release: {
name: process.env.SENTRY_RELEASE || '[email protected]',
}
}),
],
build: {
sourcemap: true,
},
},
// Pointing to CDN for assets
app: {
cdnURL: 'https://cdn.example.com',
},
})
