什么是 rollbar-redux-middleware
rollbar-redux-middleware 是一个可以与 Redux 集成的 error tracking 工具。它可以监控 Redux 应用程序中的错误，并将其记录到 Rollbar 上。
安装
使用 npm 安装 rollbar-redux-middleware：
npm install rollbar-redux-middleware
使用
1. 引入 rollbar-redux-middleware
首先，需要在项目中引入 rollbar-redux-middleware ：
import createRollbarMiddleware from 'rollbar-redux-middleware';
2. 配置 Rollbar
在项目中，需要配置 Rollbar 。在设置中，需要使用 Rollbar SDK 中的 config 方法。这里需要提供 Rollbar 的 access_token 和环境参数。可以按照以下方式：
-- -------------------- ---- -------
------ ------- ---- ----------
----- ------- - --- ---------
------------ -----------------------
---------------- -----
--------------------------- -----
-------- -----
------------ -------------
-------- -
------- -
----------- -
------------------- -----
---------------------- ----
-
-
-
---以上配置中，access_token 是强制参数。在环境参数中指定任何其他的参数。启用 source_map_enabled 选项时，Rollbar 可以在出现 JavaScript 错误时获取更多信息。
3. 集成 Rollbar Middleware 到 Redux store
为了将 Rollbar Middleware 集成到 Redux store 中，需要首先创建一个中间件实例：
const rollbarMiddleware = createRollbarMiddleware(rollbar, {
logError: (payload) => console.warn(payload),
rethrow: true,
reportError: true,
scope: 'all'
});以上中间件实例中，第一个参数是 Rollbar 的配置实例，第二个参数是 middleware 的选项。
选项中，可以使用以下参数：
logError：(Function) - 如果指定，将在报告中收集有关错误的其他信息。rethrow: (Boolean) - 如果为 true，则将错误重新抛出到错误链中，允许其他 middleware 处理事件。如果为 false，则错误将被静默记录。reportError: (Boolean) - 如果为 true，则错误将被记录到 Rollbar 中。scope: (String) - 指定错误范围。可以使用 'all' 或 'redux'。默认为 'all'。
接下来，将中间件添加到 store 的 applyMiddlewares 方法中：
const store = createStore( reducer, initialState, applyMiddleware(thunk, rollbarMiddleware) );
现在，每当发生 Redux 应用程序中的错误时，rollbar-redux-middleware 将记录这些错误。
4. 在应用程序中使用 rollbar
现在，可以在应用程序中捕获和记录 redux-app 中的错误。可以按照以下方式：
function handleButtonClick() {
try {
doSomethingThatThrowsError();
} catch (error) {
rollbar.error(error);
}
}这将把错误发送到 Rollbar，其中包括异常的堆栈信息。
总结
rollbar-redux-middleware 是一个非常有用的工具，可以方便地监控 Redux 应用程序中的错误并将其记录到 Rollbar。通过引入 Rollbar 和配置中间件，可以方便地集成到项目中。在应用程序中使用 rollbar，可以轻松捕获错误并将其记录到 Rollbar 上，从而改进项目的质量。
示例代码：
-- -------------------- ---- -------
------ ----- ---- --------
------ ------- ---- ----------
------ - ------------ --------------- - ---- --------
------ ----------------------- ---- ---------------------------
----- ------- - --- ---------
------------ -----------------------
---------------- -----
--------------------------- -----
-------- -----
------------ -------------
-------- -
------- -
----------- -
------------------- -----
---------------------- ----
-
-
-
---
----- ----------------- - -------------------------------- -
--------- --------- -- ----------------------
-------- -----
------------ -----
------ -----
---
----- ----- - ------------
--------
-------------
---------------------- ------------------
--
-------- -------- ------- -- -
------ ------- ----------------------- ------------
-
-------- ------------------- -
--- -
-----------------------------
- ----- ------- -
---------------------
-
-
-------- ----- -
------ -
-----
------- --------------------------- --
------
--
-来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/60055bdd81e8991b448d9832