ref(nuxt): Add instument.server.mjs to preview script (#38)

* add instument.server.mjs

* add sourcemaps options

* add yarn.lock

apps/nuxt/components/ErrorButton.vue

@@ -0,0 +1,9 @@
+<script setup>
+const triggerError = () => {
+ throw new Error('Nuxt Button Error');
+};
+</script>
+
+<template>
+ <button id="errorBtn" @click="triggerError">Trigger Error</button>
+</template>

apps/nuxt/nuxt.config.ts

@@ -2,5 +2,13 @@
 export default defineNuxtConfig({
  devtools: { enabled: true },
  modules: ['@sentry/nuxt/module'],
+ sentry:{
+ debug: false,
+ sourceMapsUploadOptions: {
+ org: "org",
+ project: "proj",
+ authToken: process.env.SENTRY_AUTH_TOKEN,
+ },
+ },
  debug: false,
 });

apps/nuxt/package.json

@@ -6,12 +6,12 @@
  "build": "nuxt build",
  "dev": "nuxt dev",
  "generate": "nuxt generate",
- "preview": "nuxt preview",
+ "preview": "NODE_OPTIONS='--import ./public/instrument.server.mjs' nuxt preview",
  "postinstall": "nuxt prepare",
  "clean": "npx nuxi cleanup"
  },
  "dependencies": {
- "@sentry/nuxt": "8.17.0",
+ "@sentry/nuxt": "8.20.0",
  "nuxt": "^3.12.2"
  },
  "//": {
@@ -20,6 +20,8 @@
  "@sentry/core": "file:.yalc/@sentry/core",
  "@sentry/node": "file:.yalc/@sentry/node",
  "@sentry/nuxt": "file:.yalc/@sentry/nuxt",
+ "@sentry/opentelemetry": "file:.yalc/@sentry/opentelemetry",
+ "@sentry/types": "file:.yalc/@sentry/types",
  "@sentry/utils": "file:.yalc/@sentry/utils",
  "@sentry/vue": "file:.yalc/@sentry/vue"
  }

apps/nuxt/pages/client-error.vue

@@ -0,0 +1,7 @@
+<script setup>
+import ErrorButton from '../components/ErrorButton.vue';
+</script>
+
+<template>
+ <ErrorButton />
+</template>

apps/nuxt/pages/index.vue

@@ -1,13 +1,3 @@
 <template>
- <div><button @click="triggerError">Trigger Error</button><br /></div>
-</template>
-
-<script>
-export default {
- methods: {
- triggerError() {
- throw new Error('This is a test error for Sentry');
- },
- },
-};
-</script>
+ <h1>Hello!</h1>
+</template>

apps/nuxt/pages/test-param/[param].vue

@@ -1,3 +1,4 @@
 <template>
  <p>{{ $route.params.param }} - {{ $route.params.param }}</p>
+ <ErrorButton />
 </template>

apps/nuxt/public/instrument.server.mjs

@@ -0,0 +1,9 @@
+import * as Sentry from '@sentry/nuxt';
+
+if(process.env.SENTRY_DSN) {
+ Sentry.init({
+ dsn: process.env.SENTRY_DSN,
+ tracesSampleRate: 1,
+ debug: true,
+ });
+}

apps/nuxt/sentry.client.config.ts

@@ -3,6 +3,5 @@ import * as Sentry from '@sentry/nuxt';
 Sentry.init({
  dsn: 'your-dsn',
  debug: true,
- tracesSampleRate: 1,
- integrations: [Sentry.browserTracingIntegration()],
+ tracesSampleRate: 1
 });