Skip to content
Merged
Show file tree
Hide file tree
Changes from 6 commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
98 changes: 98 additions & 0 deletions CONTRIBUTING.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,98 @@
# Contributing to Rollbar.js

Thank you for your interest in contributing to Rollbar.js! We welcome contributions from the community.

## Getting Started

1. Fork the repository on GitHub
2. Clone your fork locally:
```bash
git clone https://github.com/your-username/rollbar.js.git
cd rollbar.js
```
3. Install dependencies:
```bash
npm install
```
4. Build the project:
```bash
npm run build
```

## Development Workflow

### Running Tests

Run all tests:
```bash
npm test
```

Run only browser tests:
```bash
npm run test-browser
```

Run only server tests:
```bash
npm run test-server
```

### Code Style

- We use ESLint for code quality. Run `npm run lint` before submitting
- Code should follow the existing style patterns in the codebase
- Use 2 spaces for indentation
- Use single quotes for strings

### Making Changes

1. Create a feature branch from `master`:
```bash
git checkout -b my-feature-name
```

2. Make your changes and ensure:
- All tests pass
- Code follows our style guidelines
- New features include appropriate tests
- Documentation is updated if needed

3. Commit your changes with a clear message:
```bash
git commit -m "Add feature: description of what you added"
```

## Submitting a Pull Request

1. Push your changes to your fork:
```bash
git push origin my-feature-name
```

2. Open a pull request on GitHub against the `master` branch

3. In your pull request description:
- Clearly describe what changes you've made
- Reference any related issues
- Include testing steps if applicable

4. Wait for review and address any feedback

## Reporting Issues

- Use GitHub Issues to report bugs
- Include as much detail as possible:
- Steps to reproduce
- Expected behavior
- Actual behavior
- Environment details (browser, Node.js version, etc.)

## Questions?

If you have questions, please:
- Check existing issues and documentation
- Open a GitHub issue for clarification
- Email [email protected] for urgent matters

Thank you for contributing to Rollbar.js!
58 changes: 50 additions & 8 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -9,8 +9,8 @@
</p>

![Build Status](https://github.com/rollbar/rollbar.js/workflows/Rollbar.js%20CI/badge.svg?tag=latest)
[![Code Quality: Javascript](https://img.shields.io/lgtm/grade/javascript/g/rollbar/rollbar.js.svg?logo=lgtm&logoWidth=18)](https://lgtm.com/projects/g/rollbar/rollbar.js/context:javascript)
[![Total Alerts](https://img.shields.io/lgtm/alerts/g/rollbar/rollbar.js.svg?logo=lgtm&logoWidth=18)](https://lgtm.com/projects/g/rollbar/rollbar.js/alerts)
[![npm version](https://img.shields.io/npm/v/rollbar.svg)](https://www.npmjs.com/package/rollbar)
[![npm downloads](https://img.shields.io/npm/dm/rollbar.svg)](https://www.npmjs.com/package/rollbar)
Comment on lines -12 to +13
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

lgtm was deprecated by github in favor of their native "code scanning" thing which I haven't investigated, decided however to remove these and do (what seems to be) the more classic npm version+downloads.

We have 1.5M dl a month which seemed like a nice number to show off.


---

Expand All @@ -22,15 +22,56 @@
- **Advanced search:** Filter items by many different properties. <a href="https://docs.rollbar.com/docs/search-items">Learn more about search</a>.
- **Customizable notifications:** Rollbar supports several messaging and incident management tools where your team can get notified about errors and important events by real-time alerts. <a href="https://docs.rollbar.com/docs/notifications">Learn more about Rollbar notifications</a>.

## Setup Instructions
## Installation

1. [Sign up for a Rollbar account](https://rollbar.com/signup).
2. For client-side Javascript, follow the [Browser Quick Start](https://docs.rollbar.com/docs/javascript#section-quick-start-browser) instructions. For Node.js, follow the [Server Quick Start](https://docs.rollbar.com/docs/javascript#section-quick-start-server).
Using npm:

```bash
npm install --save rollbar
```

Using yarn:

```bash
yarn add rollbar
```

For CDN/script tag installation, see [Quick Start → Browser](#browser)

## Quick Start

First, [**sign up for a Rollbar account**](https://rollbar.com/signup) if you haven't already.

### Browser

For the recommended snippet-based installation with automatic error capture and telemetry, see our [Browser JS – Quick Start documentation](https://docs.rollbar.com/docs/browser-js#quick-start).

### Node.js

```javascript
const Rollbar = require('rollbar');

const rollbar = new Rollbar({
accessToken: 'POST_SERVER_ITEM_ACCESS_TOKEN',
captureUncaught: true,
captureUnhandledRejections: true,
payload: { code_version: '1.0.0' },
});

// log a generic message and send to rollbar
rollbar.log('Hello world!');
```

For **framework** integrations (**Express**, **Koa**, **Hapi**, and more), custom error handlers, and advanced configuration, see our [Node.js server configuration documentation](https://docs.rollbar.com/docs/nodejs#server-configuration).

## Usage and Reference

For complete usage instructions and configuration reference, see our [Javascript SDK docs](https://docs.rollbar.com/docs/javascript).

### Examples

See the [examples directory](./examples/) for detailed integration examples with various frameworks and build tools including **React**, **Angular**, **Vue.js**, **Next.js**, and more.

## Release History & Changelog

See our [Releases](https://github.com/rollbar/rollbar.js/releases) page for a list of all releases, including changes.
Expand All @@ -45,10 +86,11 @@ For bug reports, please [open an issue on GitHub](https://github.com/rollbar/rol

To set up a development environment, you'll need Node.js and npm.

2. `npm install -D`
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I'm not sure why the -D...?

3. `make`
1. Clone the repository: `git clone https://github.com/rollbar/rollbar.js.git`
2. Install dependencies: `npm install`
3. Build: `npm run build`

To run the tests, run `make test`.
To run the tests: `npm test`
Copy link
Contributor Author

@matux matux Jul 19, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Don't know why do we even have a Makefile, do js devs not know how to use npm? 😂

I was tempted to remove the Makefile, but I'm not sure if its being used by the CI or something else.


## Contributing

Expand Down
56 changes: 30 additions & 26 deletions examples/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -6,70 +6,75 @@ This directory contains examples demonstrating various ways to integrate Rollbar

The following table shows all supported integration methods across different platforms:

| Environment | Script Tag | CommonJS | ESM Import | TypeScript | AMD |
|-------------|------------|----------|------------|------------|-----|
| **Browser** | ✅ [script.html](./script.html) | — | ✅ via bundler | ✅ via bundler | ✅ [requirejs/](./requirejs/) |
| **Node.js** | — | ✅ `require('rollbar')` | ✅ `import` | ✅ | — |
| **React** | ✅ | ✅ [react/](./react/) | ✅ | ✅ | — |
| **Angular** | — | — | ✅ [angular/](./angular/) | ✅ | — |
| **Vue.js** | ✅ | ✅ | ✅ [vuejs3/](./vuejs3/) | ✅ | — |
| **Next.js** | — | ✅ SSR/Client | ✅ SSR/Client | ✅ | — |
| **Browser Extension** | ✅ [v2](./browser_extension_v2/), [v3](./browser_extension_v3/) | — | ✅ | ✅ | — |
| Environment | Script Tag | CommonJS | ESM Import | TypeScript | AMD |
| --------------------- | --------------------------------------------------------------- | ----------------------- | ------------------------- | -------------- | ----------------------------- |
| **Browser** | ✅ [script.html](./script.html) | — | ✅ via bundler | ✅ via bundler | ✅ [requirejs/](./requirejs/) |
| **Node.js** | — | ✅ `require('rollbar')` | ✅ `import` | ✅ | — |
| **React Native** | — | ✅ | ✅ | ✅ | — |
| **React** | ✅ | ✅ [react/](./react/) | ✅ | ✅ | — |
| **Angular** | — | — | ✅ [angular/](./angular/) | ✅ | — |
| **Vue.js** | ✅ | ✅ | ✅ [vuejs3/](./vuejs3/) | ✅ | — |
| **Next.js** | — | ✅ SSR/Client | ✅ SSR/Client | ✅ | — |
| **Browser Extension** | ✅ [v2](./browser_extension_v2/), [v3](./browser_extension_v3/) | — | ✅ | ✅ | — |

## Quick Start

Each example includes its own README with specific setup instructions. Common patterns:
First, [sign up for a Rollbar account](https://rollbar.com/signup) if you haven't already. Each example includes its own README with specific setup instructions.

Common patterns:

### Browser (Script Tag)
```html
<script src="https://cdn.rollbar.com/rollbarjs/refs/tags/v2.26.4/rollbar.min.js"></script>
<script>
var _rollbarConfig = {
accessToken: "YOUR_ACCESS_TOKEN",
captureUncaught: true,
captureUnhandledRejections: true
};
</script>
```

For the recommended snippet-based installation with automatic error capture and telemetry, see our [Browser JS – Quick Start documentation](https://docs.rollbar.com/docs/browser-js#quick-start).

### Node.js / CommonJS

```javascript
const Rollbar = require('rollbar');

const rollbar = new Rollbar({
accessToken: 'YOUR_ACCESS_TOKEN',
environment: 'production'
accessToken: 'POST_SERVER_ITEM_ACCESS_TOKEN',
captureUncaught: true,
captureUnhandledRejections: true,
payload: { code_version: '1.0.0' },
});
```

### ES Modules / TypeScript

```javascript
import Rollbar from 'rollbar';

const rollbar = new Rollbar({
accessToken: 'YOUR_ACCESS_TOKEN',
environment: 'production'
environment: 'production',
});
```

## Available Examples

### Framework Examples

- **[angular/](./angular/)** - Angular 18+ with TypeScript and error handlers
- **[react/](./react/)** - React with error boundaries
- **[vuejs3/](./vuejs3/)** - Vue.js 3 with Vite

### Build Tool Examples

- **[browserify/](./browserify/)** - Browserify bundler integration
- **[webpack/](./webpack/)** - Webpack bundler configuration
- **[requirejs/](./requirejs/)** - AMD/RequireJS loader

### Environment Examples

- **[universal-browser/](./universal-browser/)** - Isomorphic JavaScript (browser)
- **[universal-node/](./universal-node/)** - Isomorphic JavaScript (Node.js)
- **[browser_extension_v2/](./browser_extension_v2/)** - Chrome extension (Manifest V2)
- **[browser_extension_v3/](./browser_extension_v3/)** - Chrome extension (Manifest V3)
- **[no-conflict/](./no-conflict/)** - Using Rollbar with noConflict mode

### Basic Examples

- **[snippet.html](./snippet.html)** - Async snippet integration
- **[script.html](./script.html)** - Direct script tag
- **[error.html](./error.html)** - Error handling examples
Expand All @@ -83,11 +88,13 @@ const rollbar = new Rollbar({
To test these examples with your local Rollbar.js build:

1. Build the library:

```bash
npm run build
```

2. For Node.js examples:

```bash
cd examples/universal-node
npm install
Expand Down Expand Up @@ -131,6 +138,3 @@ When you use `require('rollbar')` or `import Rollbar from 'rollbar'`, you automa
- `rollbar/dist/rollbar.snippet.js` - Async snippet loader
- `rollbar/dist/rollbar.named-amd.js` - AMD/RequireJS

### CDN

- `https://cdn.rollbar.com/rollbarjs/refs/tags/vVERSION/rollbar.min.js`
Loading