Question

我尝试将Airbrake-js集成到我的开发设置中以报告JavaScript错误。我的应用程序是一个使用webpack的React应用程序。

我现在已经在网上搜索了几个小时，以弄清楚设置应该如何。我还没能在documentation找到他们的起始代码：

var airbrakeJs = require('airbrake-js');
var airbrake = new airbrakeJs({projectId: 1, projectKey: 'abc'});

实际应该定位。我的想法是，我希望我的现有应用程序包装在他们的wrap函数中（为了简洁起见，仅显示我的app.js文件的一部分）：

var airbrakeJs = require('airbrake-js'),
    React  = require('react'),
    ReactDOM = require('react-dom'),
    Relay = require('react-relay'),
    App = require('./components/app'),
    Router = require ('react-router'),
    Route = require Router.Route, 
    createBrowserHistory = require('history/lib/createBrowserHistory');

var startApp = function() {
  // This will throw if the document has no head tag.
  // ****What does this exactly do?**** 
  document.head.insertBefore(document.createElement("style"));
}
startApp = airbrake.wrap(myApp);

// Any exceptions thrown in startApp will be reported to Airbrake.
startApp();

ReactDOM.render((
  <Router history={createBrowserHistory()} createElement={ReactRouterRelay.createElement}>
    <Route component={App} queries={AppQueries} {...renderProps}>
      <Route path="/somewhere" component={Somewhere} queries={SomewhereQueries} />
    </Route>
  </Router>
), document.getElementById('academy-body'));

所以，我把它添加到我的入口点app.js文件（我也处理我的路由器逻辑），但它没有被调用，所以我一定做错了。我也不知道第二行（第一条评论的正下方）到底是做什么的。

任何人都可以解释并帮助Airbrake正确设置吗？ Airbrake-js是否会使用React应用程序？

非常感谢任何正确方向的帮助！

Answer 1

您应该使用

实例化空气制动器

window.airbrake = new airbrakeJs({projectId: 1, projectKey: 'abc'});
// replace projectId and projectKey with your project values

首先，您可以尝试将其添加到现有代码中。请注意，我们正在使用window全局范围从任何子范围访问Airbrake的实例。通常这不是一个好习惯，但对于Airbreake来说看起来很公平。

这一行

 document.head.insertBefore(document.createElement("style"));

这只是一个在文档中使用的可能引发错误的示例。你可以从你的代码中删除它。

这是为了将Airbrake包裹在特定的功能中。

startApp = airbrake.wrap(myApp);

// Any exceptions thrown in startApp will be reported to Airbrake.
startApp();

您可以从代码中删除它。

如果Airbrake实际捕获错误，您可以使用它来调试：

// Remove it for production or use an enviroment conditional

airbrake.addReporter(function(notice) {
  console.log(notice);
});

使用ReactJS应用程序和webpack设置Airbrake-js

1 个答案: