Search code examples
javascriptgoogle-chrome-extensionimportmodulesentry

Import Sentry as module to the Chrome extension (manifest v3)


I've been digging into the info for a while, so please read the whole question before marking it as duplicate. The question might be pretty trivial, however, nothing of what I've found helped me.

So, I want to add Sentry to my Chrome extension. I don't want to mess with CDN, so it's okay for me to download Sentry lib and store it locally.

I use Chrome Extension manifest v3, marked my background.js as a module, but cant properly import Sentry lib (or actually reach it, call its methods): constantly get an error

TypeError: Sentry.init is not a function

and in the Toolkit, Sentry is not even recognized as a module.

manifest:

  "background": { 
    "service_worker": "background.js",
    "type": "module"
  },
  "minimum_chrome_version": "92",

background.js:

import * as Sentry from './libs/sentry.js';

chrome.runtime.onStartup.addListener(() => {

  Sentry.init({
    dsn: "https://[email protected]/666",
  });

  Sentry.captureMessage("test");
  
});

I've tried both https://browser.sentry-cdn.com/7.14.2/bundle.js and https://browser.sentry-cdn.com/7.14.2/bundle.es5.js as libs/sentry.js

Here's repro sample: https://drive.google.com/file/d/1IFWVn34-E0y6452n_jsCfBTAkaMicQJS/view?usp=sharing


Solution

  • As suggested by woxxom, i've changed sentry.js:

    export var Sentry = (function (exports) { // added "export"
    

    and used it as

    import * as SentryLib from './libs/sentry.js';
    *** 
    SentryLib.Sentry.init({ });
    

    Just a syntax note for future me, or someone else who might be stuck on something similar.