rollbar.js
rollbar.js copied to clipboard
Updated examples and new ones for new replay bundles
Description of the change
- Added comprehensive
Replay(rollbar/replay) examples demonstrating both modern and legacy integration patterns. - Modernizes the webpack and React examples to use current tooling (Webpack 5, Babel 7, React 18) while preserving legacy examples for backward compatibility.
Modern Examples (New/Updated):
- examples/webpack/ - Webpack 5 with modern ES module syntax
- examples/webpack-replay/ - Webpack 5 + Replay using import from 'rollbar/replay'
- examples/react/ - Webpack 5 + Babel 7 + React 18 with hooks
- examples/react-replay/ - React 18 + Replay with modern patterns
- examples/universal-browser-replay/ - Script tag usage with Replay bundles
Legacy Examples (Renamed for Compatibility):
- examples/webpack4/ - Webpack 4 (previously webpack/)
- examples/webpack4-replay/ - Webpack 4 + Replay with alias workaround
- examples/react-webpack4/ - Webpack 4 + Babel 6 + React 16 (previously react/)
- examples/react-webpack4-replay/ - React 16 + Replay with alias
Example main code
Modern (Webpack 5):
import Rollbar from 'rollbar/replay';
const rollbar = new Rollbar({
accessToken: 'TOKEN',
replay: {
enabled: true,
autoStart: true,
},
});
Legacy (Webpack 4):
// webpack.config.js
resolve: {
alias: {
'rollbar/replay': path.resolve(__dirname, 'node_modules/rollbar/dist/rollbar.replay.umd.min.js'),
},
}
Script Tag:
Uses pre-built bundle to avoid ES2021 syntax transpilation issues.
<script>
let _rollbarConfig = {
rollbarJsUrl: '/dist/rollbar.replay.min.js',
replay: { enabled: true, autoStart: true },
};
</script>