NuxtJS Sentry Module

nuxt.config.js

module.exports = {
  /* ... */
  modules: [
    ['~/modules/sentry', {
      public_key: '',
      private_key: '',
      project_id: '',
    }],
  ],
  /* ... */
};

sentry-client.js

/* global options:true */

import Vue from 'vue';
import Raven from 'raven-js';
import RavenVue from 'raven-js/plugins/vue';

Raven
  .config(`https://${options.public_key}@sentry.io/${options.project_id}`)
  .addPlugin(RavenVue, Vue)
  .install();

sentry.js

const Raven = require('raven');
const path = require('path');

module.exports = function sentryErrorMiddleware(options) {
  // Setup raven
  Raven.config(`https://${options.public_key}:${options.private_key}@sentry.io/${options.project_id}`).install();

  // Register the client plugin
  this.addPlugin({ src: path.resolve(__dirname, 'sentry-client.js'), options });

  // Hook in to Nuxt renderer
  this.nuxt.plugin('renderer', (renderer) => {
    renderer.app.use(Raven.requestHandler());

    // Grab Nuxt's original error middleware and overwrite it with our own
    const nuxtErrorMiddleware = renderer.errorMiddleware;
    renderer.errorMiddleware = (err, req, res, next) => {
      // Log the error
      res.sentry = Raven.captureException(err, { req });

      // Call Nuxt's original error middleware
      nuxtErrorMiddleware.call(renderer, err, req, res, next);
    };
  });
};

Hi @DiederikvandenB ;

I came across these codes while researching on the internet. Nuxt's sentry module (@nuxtjs/sentry) does not report client-side errors. I tried this on my own localhost. Are your codes still valid?

What should I do to report client-side errors? It already exists in the current sentry module but I couldn't set it.

My configuration is here:
nuxt.config.js

  sentry: {
    dsn: 'https://*****
    publishRelease: true,
    sourceMapStyle: 'hidden-source-map',
    // disabled: TODO later
  },