123456 |
- {
- "html": "<div class=\"section\" id=\"installation\">\n<h2>Installation</h2>\n<p>Raven.js and the Raven.js Angular plugin are distributed using a few different methods.</p>\n<div class=\"section\" id=\"using-our-cdn\">\n<h3>Using our CDN</h3>\n<p>For convenience, our CDN serves a single, minified JavaScript file containing both Raven.js and the Raven.js AngularJS plugin. It should be included <strong>after</strong> Angular, but <strong>before</strong> your application code.</p>\n<p>Example:</p>\n<div class=\"highlight-html\"><div class=\"highlight\" style=\"background: #ffffff\"><pre style=\"line-height: 125%\"><span></span><span style=\"color: #111111\"><</span><span style=\"color: #2eb0f7\">script</span> <span style=\"color: #a47ac6\">src</span><span style=\"color: #4b4f5c\">=</span><span style=\"color: #e8535a\">"https://ajax.googleapis.com/ajax/libs/angularjs/1.4.5/angular.min.js"</span><span style=\"color: #111111\">></</span><span style=\"color: #2eb0f7\">script</span><span style=\"color: #111111\">></span>\n<span style=\"color: #111111\"><</span><span style=\"color: #2eb0f7\">script</span> <span style=\"color: #a47ac6\">src</span><span style=\"color: #4b4f5c\">=</span><span style=\"color: #e8535a\">"https://cdn.ravenjs.com/3.20.1/angular/raven.min.js"</span> <span style=\"color: #a47ac6\">crossorigin</span><span style=\"color: #4b4f5c\">=</span><span style=\"color: #e8535a\">"anonymous"</span><span style=\"color: #111111\">></</span><span style=\"color: #2eb0f7\">script</span><span style=\"color: #111111\">></span>\n<span style=\"color: #111111\"><</span><span style=\"color: #2eb0f7\">script</span><span style=\"color: #111111\">>Raven.config(</span><span style=\"color: #e8535a\">'___PUBLIC_DSN___'</span><span style=\"color: #111111\">).install();</</span><span style=\"color: #2eb0f7\">script</span><span style=\"color: #111111\">></span>\n</pre></div>\n</div>\n<p>Note that this CDN build auto-initializes the Angular plugin.</p>\n</div>\n<div class=\"section\" id=\"using-package-managers\">\n<h3>Using package managers</h3>\n<p>Pre-built distributions of Raven.js and the Raven.js AngularJS plugin are available via both Bower and npm.</p>\n<div class=\"section\" id=\"bower\">\n<h4>Bower</h4>\n<div class=\"highlight-sh\"><div class=\"highlight\" style=\"background: #ffffff\"><pre style=\"line-height: 125%\"><span></span>$ bower install raven-js --save\n</pre></div>\n</div>\n<div class=\"highlight-html\"><div class=\"highlight\" style=\"background: #ffffff\"><pre style=\"line-height: 125%\"><span></span><span style=\"color: #111111\"><</span><span style=\"color: #2eb0f7\">script</span> <span style=\"color: #a47ac6\">src</span><span style=\"color: #4b4f5c\">=</span><span style=\"color: #e8535a\">"/bower_components/angular/angular.js"</span><span style=\"color: #111111\">></</span><span style=\"color: #2eb0f7\">script</span><span style=\"color: #111111\">></span>\n<span style=\"color: #111111\"><</span><span style=\"color: #2eb0f7\">script</span> <span style=\"color: #a47ac6\">src</span><span style=\"color: #4b4f5c\">=</span><span style=\"color: #e8535a\">"/bower_components/raven-js/dist/raven.js"</span><span style=\"color: #111111\">></</span><span style=\"color: #2eb0f7\">script</span><span style=\"color: #111111\">></span>\n<span style=\"color: #111111\"><</span><span style=\"color: #2eb0f7\">script</span> <span style=\"color: #a47ac6\">src</span><span style=\"color: #4b4f5c\">=</span><span style=\"color: #e8535a\">"/bower_components/raven-js/dist/plugins/angular.js"</span><span style=\"color: #111111\">></</span><span style=\"color: #2eb0f7\">script</span><span style=\"color: #111111\">></span>\n<span style=\"color: #111111\"><</span><span style=\"color: #2eb0f7\">script</span><span style=\"color: #111111\">></span>\n <span style=\"color: #111111\">Raven</span>\n <span style=\"color: #111111\">.config(</span><span style=\"color: #e8535a\">'___PUBLIC_DSN___'</span><span style=\"color: #111111\">)</span>\n <span style=\"color: #111111\">.addPlugin(Raven.Plugins.Angular)</span>\n <span style=\"color: #111111\">.install();</span>\n<span style=\"color: #111111\"></</span><span style=\"color: #2eb0f7\">script</span><span style=\"color: #111111\">></span>\n</pre></div>\n</div>\n</div>\n<div class=\"section\" id=\"npm\">\n<h4>npm</h4>\n<div class=\"highlight-sh\"><div class=\"highlight\" style=\"background: #ffffff\"><pre style=\"line-height: 125%\"><span></span>$ npm install raven-js --save\n</pre></div>\n</div>\n<div class=\"highlight-html\"><div class=\"highlight\" style=\"background: #ffffff\"><pre style=\"line-height: 125%\"><span></span><span style=\"color: #111111\"><</span><span style=\"color: #2eb0f7\">script</span> <span style=\"color: #a47ac6\">src</span><span style=\"color: #4b4f5c\">=</span><span style=\"color: #e8535a\">"/node_modules/angular/angular.js"</span><span style=\"color: #111111\">></</span><span style=\"color: #2eb0f7\">script</span><span style=\"color: #111111\">></span>\n<span style=\"color: #111111\"><</span><span style=\"color: #2eb0f7\">script</span> <span style=\"color: #a47ac6\">src</span><span style=\"color: #4b4f5c\">=</span><span style=\"color: #e8535a\">"/node_modules/raven-js/dist/raven.js"</span><span style=\"color: #111111\">></</span><span style=\"color: #2eb0f7\">script</span><span style=\"color: #111111\">></span>\n<span style=\"color: #111111\"><</span><span style=\"color: #2eb0f7\">script</span> <span style=\"color: #a47ac6\">src</span><span style=\"color: #4b4f5c\">=</span><span style=\"color: #e8535a\">"/node_modules/raven-js/dist/plugins/angular.js"</span><span style=\"color: #111111\">></</span><span style=\"color: #2eb0f7\">script</span><span style=\"color: #111111\">></span>\n<span style=\"color: #111111\"><</span><span style=\"color: #2eb0f7\">script</span><span style=\"color: #111111\">></span>\n <span style=\"color: #111111\">Raven</span>\n <span style=\"color: #111111\">.config(</span><span style=\"color: #e8535a\">'___PUBLIC_DSN___'</span><span style=\"color: #111111\">)</span>\n <span style=\"color: #111111\">.addPlugin(Raven.Plugins.Angular)</span>\n <span style=\"color: #111111\">.install();</span>\n<span style=\"color: #111111\"></</span><span style=\"color: #2eb0f7\">script</span><span style=\"color: #111111\">></span>\n</pre></div>\n</div>\n<p>These examples assume that AngularJS is exported globally as <cite>window.angular</cite>. You can alternatively pass a reference to the <cite>angular</cite> object directly as the second argument to <cite>addPlugin</cite>:</p>\n<div class=\"highlight-javascript\"><div class=\"highlight\" style=\"background: #ffffff\"><pre style=\"line-height: 125%\"><span></span><span style=\"color: #111111\">Raven.addPlugin(Raven.Plugins.Angular,</span> <span style=\"color: #111111\">angular);</span>\n</pre></div>\n</div>\n</div>\n</div>\n<div class=\"section\" id=\"module-loaders-commonjs\">\n<h3>Module loaders (CommonJS)</h3>\n<p>Raven and the Raven AngularJS plugin can be loaded using a module loader like Browserify or Webpack.</p>\n<div class=\"highlight-javascript\"><div class=\"highlight\" style=\"background: #ffffff\"><pre style=\"line-height: 125%\"><span></span><span style=\"color: #2eb0f7\">var</span> <span style=\"color: #111111\">angular</span> <span style=\"color: #4b4f5c\">=</span> <span style=\"color: #111111\">require(</span><span style=\"color: #e8535a\">'angular'</span><span style=\"color: #111111\">);</span>\n<span style=\"color: #2eb0f7\">var</span> <span style=\"color: #111111\">Raven</span> <span style=\"color: #4b4f5c\">=</span> <span style=\"color: #111111\">require(</span><span style=\"color: #e8535a\">'raven-js'</span><span style=\"color: #111111\">);</span>\n\n<span style=\"color: #111111\">Raven</span>\n <span style=\"color: #111111\">.config(</span><span style=\"color: #e8535a\">'___PUBLIC_DSN___'</span><span style=\"color: #111111\">)</span>\n <span style=\"color: #111111\">.addPlugin(require(</span><span style=\"color: #e8535a\">'raven-js/plugins/angular'</span><span style=\"color: #111111\">),</span> <span style=\"color: #111111\">angular)</span>\n <span style=\"color: #111111\">.install();</span>\n</pre></div>\n</div>\n<p>Note that when using CommonJS-style imports, you must pass a reference to <cite>angular</cite> as the second argument to <cite>addPlugin</cite>.</p>\n</div>\n</div>\n",
- "link": "https://docs.getsentry.com/clients/javascript/integrations/angularjs/",
- "id": "javascript-angularjs",
- "name": "AngularJS"
- }
|