Skip to content

Clarify import statements in ng2 docs #673

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 1 commit into from
Aug 3, 2016
Merged
Changes from all 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
39 changes: 31 additions & 8 deletions docs/integrations/angular2.rst
Original file line number Diff line number Diff line change
Expand Up @@ -6,12 +6,9 @@ On its own, Raven.js will report any uncaught exceptions triggered from your app
Additionally, Raven.js can be configured to catch any Angular 2-specific exceptions reported through the `angular2/core/ExceptionHandler
<https://angular.io/docs/js/latest/api/core/index/ExceptionHandler-class.html>`_ component.

**Note**: This document assumes you are writing your Angular 2 project in TypeScript, and using `SystemJS
<https://github.com/systemjs/systemjs>`_ as your module bundler.


TypeScript Support
~~~~~~~~~~~~~~~~~~
------------------

Raven.js ships with a `TypeScript declaration file
<https://github.com/getsentry/raven-js/blob/master/typescript/raven.d.ts>`_, which helps static checking correctness of
Expand All @@ -31,6 +28,15 @@ Raven.js should be installed via npm.
Configuration
-------------

Configuration depends on which module loader/packager you are using to build your Angular 2 application.

Below are instructions for `SystemJS
<https://github.com/systemjs/systemjs>`__, followed by instructions for `Webpack
<https://webpack.github.io/>`__, Angular CLI, and other module loaders/packagers.

SystemJS
~~~~~~~~

First, configure SystemJS to locate the Raven.js package:

.. code-block:: js
Expand Down Expand Up @@ -73,13 +79,30 @@ Then, in your main application file (where ``bootstrap`` is called, e.g. main.ts

Once you've completed these two steps, you are done.

Webpack and Other Module Loaders
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
Webpack, Angular CLI, and Other Module Loaders
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

In Webpack and other module loaders, you may need to use the require keyword to load Raven:
In Webpack, Angular CLI, and other module loaders/packagers, you may need to use the **require** keyword as
part of your `import` statement:

.. code-block:: js

import Raven = require('raven-js');
import Raven = require('raven-js'); // NOTE: "require" not "from"
import { bootstrap } from 'angular2/platform/browser';
import { MainApp } from './app.component';
import { provide, ExceptionHandler } from 'angular2/core';

Raven
.config('___PUBLIC_DSN___')
.install();

class RavenExceptionHandler {
call(err:any) {
Raven.captureException(err.originalException);
}
}

bootstrap(MainApp, [
provide(ExceptionHandler, {useClass: RavenExceptionHandler})
]);