Add commonjs wrappers to components when using require (#1288)

matux · web-flow · commit e3bd8c65842b · 2025-08-07T21:19:51.000Z
diff --git a/examples/webpack-require/.gitignore b/examples/webpack-require/.gitignore
@@ -0,0 +1 @@
+public/bundle.js
diff --git a/examples/webpack-require/README.md b/examples/webpack-require/README.md
@@ -0,0 +1,10 @@
+# Bare bones webpack project
+
+Check the rollbar location in package.json and change it to your own.
+`npm install`
+
+You **have to** build after making changes.
+`npm run build`
+
+Then start the webpack server.
+`npm run start`
diff --git a/examples/webpack-require/package.json b/examples/webpack-require/package.json
@@ -0,0 +1,22 @@
+{
+  "name": "webpack-app",
+  "version": "1.0.0",
+  "description": "",
+  "main": "index.js",
+  "scripts": {
+    "start": "webpack serve",
+    "build": "webpack",
+    "test": "echo \"Error: no test specified\" && exit 1"
+  },
+  "keywords": [],
+  "author": "",
+  "license": "ISC",
+  "devDependencies": {
+    "webpack": "^5.101.0",
+    "webpack-cli": "^6.0.1",
+    "webpack-dev-server": "^5.2.2"
+  },
+  "dependencies": {
+    "rollbar": "file:../rollbar.tgz"
+  }
+}
diff --git a/examples/webpack-require/public/index.html b/examples/webpack-require/public/index.html
@@ -0,0 +1,9 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+</head>
+<body>
+  Hello, World!
+<script type="text/javascript" src="bundle.js"></script>
+</body>
+</html>
diff --git a/examples/webpack-require/src/index.js b/examples/webpack-require/src/index.js
@@ -0,0 +1,25 @@
+const Rollbar = require('rollbar/src/browser/core');
+const telemeter = require('rollbar/src/telemetry');
+const instrumenter = require('rollbar/src/browser/telemetry');
+const wrapGlobals = require('rollbar/src/browser/wrapGlobals');
+const scrub = require('rollbar/src/scrub');
+const truncation = require('rollbar/src/truncation');
+const tracing = require('rollbar/src/tracing/tracing');
+const recorder = require('rollbar/src/browser/replay/recorder');
+
+Rollbar.setComponents({
+  telemeter: telemeter,
+  instrumenter: instrumenter,
+  wrapGlobals: wrapGlobals,
+  scrub: scrub,
+  truncation: truncation,
+  tracing: tracing,
+  recorder: recorder,
+});
+
+
+const rollbar = Rollbar.init({
+  accessToken: 'TOKEN',
+  captureUncaught: true,
+  captureUnhandledRejections: true,
+});
diff --git a/examples/webpack-require/webpack.config.js b/examples/webpack-require/webpack.config.js
@@ -0,0 +1,17 @@
+const path = require('path');
+
+module.exports = {
+  mode: 'development', // or 'production'
+  entry: './src/index.js', // Your main application entry file
+  output: {
+    filename: 'bundle.js',
+    path: path.resolve(__dirname, 'public'), // Output directory
+  },
+  devServer: {
+    static: path.resolve(__dirname, 'public'), // Serve static files from 'public'
+    port: 8080,
+    hot: true, // Enable Hot Module Replacement
+    open: true, // Open the browser automatically
+  },
+  // Add loaders and plugins as needed for your project (e.g., Babel for React/Vue)
+};
diff --git a/package.json b/package.json
@@ -34,42 +34,42 @@
     },
     "./src/browser/core": {
       "types": "./src/browser/core.d.ts",
-      "require": "./src/browser/core.js",
+      "require": "./src/browser/core.cjs",
       "default": "./src/browser/core.js"
     },
     "./src/telemetry": {
       "types": "./src/telemetry.d.ts",
-      "require": "./src/telemetry.js",
+      "require": "./src/telemetry.cjs",
       "default": "./src/telemetry.js"
     },
     "./src/browser/telemetry": {
       "types": "./src/browser/telemetry.d.ts",
-      "require": "./src/browser/telemetry.js",
+      "require": "./src/browser/telemetry.cjs",
       "default": "./src/browser/telemetry.js"
     },
     "./src/browser/wrapGlobals": {
       "types": "./src/browser/wrapGlobals.d.ts",
-      "require": "./src/browser/wrapGlobals.js",
+      "require": "./src/browser/wrapGlobals.cjs",
       "default": "./src/browser/wrapGlobals.js"
     },
     "./src/scrub": {
       "types": "./src/scrub.d.ts",
-      "require": "./src/scrub.js",
+      "require": "./src/scrub.cjs",
       "default": "./src/scrub.js"
     },
     "./src/truncation": {
       "types": "./src/truncation.d.ts",
-      "require": "./src/truncation.js",
+      "require": "./src/truncation.cjs",
       "default": "./src/truncation.js"
     },
     "./src/tracing/tracing": {
       "types": "./src/tracing/tracing.d.ts",
-      "require": "./src/tracing/tracing.js",
+      "require": "./src/tracing/tracing.cjs",
       "default": "./src/tracing/tracing.js"
     },
     "./src/browser/replay/recorder": {
       "types": "./src/browser/replay/recorder.d.ts",
-      "require": "./src/browser/replay/recorder.js",
+      "require": "./src/browser/replay/recorder.cjs",
       "default": "./src/browser/replay/recorder.js"
     }
   },
diff --git a/src/browser/core.cjs b/src/browser/core.cjs
@@ -0,0 +1,7 @@
+/**
+ * CommonJS wrapper for ES module
+ *
+ * This file provides CommonJS compatibility for users who use require()
+ */
+
+module.exports = require('./core.js').default || require('./core.js');
diff --git a/src/browser/replay/recorder.cjs b/src/browser/replay/recorder.cjs
@@ -0,0 +1,7 @@
+/**
+ * CommonJS wrapper for ES module
+ *
+ * This file provides CommonJS compatibility for users who use require()
+ */
+
+module.exports = require('./recorder.js').default || require('./recorder.js');
diff --git a/src/browser/telemetry.cjs b/src/browser/telemetry.cjs
@@ -0,0 +1,7 @@
+/**
+ * CommonJS wrapper for ES module
+ *
+ * This file provides CommonJS compatibility for users who use require()
+ */
+
+module.exports = require('./telemetry.js').default || require('./telemetry.js');
diff --git a/src/browser/wrapGlobals.cjs b/src/browser/wrapGlobals.cjs
@@ -0,0 +1,8 @@
+/**
+ * CommonJS wrapper for ES module
+ *
+ * This file provides CommonJS compatibility for users who use require()
+ */
+
+module.exports =
+  require('./wrapGlobals.js').default || require('./wrapGlobals.js');
diff --git a/src/scrub.cjs b/src/scrub.cjs
@@ -0,0 +1,7 @@
+/**
+ * CommonJS wrapper for ES module
+ *
+ * This file provides CommonJS compatibility for users who use require()
+ */
+
+module.exports = require('./scrub.js').default || require('./scrub.js');
diff --git a/src/telemetry.cjs b/src/telemetry.cjs
@@ -0,0 +1,7 @@
+/**
+ * CommonJS wrapper for ES module
+ *
+ * This file provides CommonJS compatibility for users who use require()
+ */
+
+module.exports = require('./telemetry.js').default || require('./telemetry.js');
diff --git a/src/tracing/tracing.cjs b/src/tracing/tracing.cjs
@@ -0,0 +1,7 @@
+/**
+ * CommonJS wrapper for ES module
+ *
+ * This file provides CommonJS compatibility for users who use require()
+ */
+
+module.exports = require('./tracing.js').default || require('./tracing.js');
diff --git a/src/truncation.cjs b/src/truncation.cjs
@@ -0,0 +1,8 @@
+/**
+ * CommonJS wrapper for ES module
+ *
+ * This file provides CommonJS compatibility for users who use require()
+ */
+
+module.exports =
+  require('./truncation.js').default || require('./truncation.js');
