Source Maps
To enable readable stack traces in your Sentry errors, you need to upload your source maps to Sentry.
Uploading Source Maps using Vite
If you are using Vue, chances are good you are using Vite to bundle your project. You can use the Sentry Vite plugin to automatically create releases and upload source maps to Sentry when bundling your app.
Installation
npm install @sentry/vite-plugin --save-dev
Configuration
Learn more about configuring the plugin in our Sentry Vite Plugin documentation.
Example:
vite.config.js
import { fileURLToPath, URL } from "node:url";
import { defineConfig } from "vite";
import vue from "@vitejs/plugin-vue";
import { sentryVitePlugin } from "@sentry/vite-plugin";
// https://vitejs.dev/config/
export default defineConfig({
build: {
sourcemap: true, // Source map generation must be turned on
},
plugins: [
vue(),
// Put the Sentry vite plugin after all other plugins
sentryVitePlugin({
org: "example-org",
project: "example-project",
// Auth tokens can be obtained from https://sentry.io/settings/account/api/auth-tokens/
// and need `project:releases` and `org:read` scopes
authToken: process.env.SENTRY_AUTH_TOKEN,
sourcemaps: {
// Specify the directory containing build artifacts
assets: "./dist/**",
},
// Use the following option if you're on an SDK version lower than 7.47.0:
// include: "./dist",
// Optionally uncomment the line below to override automatic release name detection
// release: process.env.RELEASE,
}),
],
resolve: {
alias: {
"@": fileURLToPath(new URL("./src", import.meta.url)),
},
},
});
Other Bundlers
In case you are using a bundler other than Vite to build your Vue project, we've compiled a list of guides on how to upload source maps to Sentry for the most popular JavaScript bundlers:
Other Tools
If you're not using any of tools above, we assume you already know how to generate source maps with your toolchain and we recommend you upload them using Sentry CLI.
Though we strongly recommend uploading source maps as part of your build process, for browser applications it's also possible to host your source maps publicly.
Additional Resources
- Using sentry-cli to Upload Source Maps
- 4 Reasons Why Your Source Maps Are Broken
- Debug Your Node.js Projects with Source Maps
Our documentation is open source and available on GitHub. Your contributions are welcome, whether fixing a typo (drat!) to suggesting an update ("yeah, this would be better").
- Package:
- npm:@sentry/vue
- Version:
- 7.51.0
- Repository:
- https://github.com/getsentry/sentry-javascript