I'm new to Redux and a little confused on how to log error messages to the console. I'm using React, Redux Toolkit and TypeScript.

This is an example of a reducer I wrote:

// Reducer const removeResourceReducer = (state: ResourceCounts, action: ResourceAction) => { const { id, amount } = action.payload; assertIsPositive(amount); const has = state[id] ?? 0; if (amount > has) { throw new Error(`Trying to take ${amount} ${id} from global resources only containing ${has}`); } state[id] = has - amount; if (state[id] === 0) { delete state[id]; } return state; } // Assertion functions export const assert = (condition: any, msg: string): asserts condition => { if (!condition) { throw new Error(`Assertion Error: ${msg}`); } } export const assertIsPositive = (num: number) => { return assert(num > 0, `Expected a positive number, but got ${num}`); }

As you can see, if the amount I pass in is less than 1 or greater than the amount of available resources, an error will be thrown. I would like this error to be logged to the console so I can check it in the dev tools, but when I pass in an invalid number nothing is logged. To achieve this, I tried adding a custom middleware, wrappingnext(action)in a try/catch block, the catch block callsconsole.error(err), I've also tried wrapping my root component renderer in a try/catch to achieve the same result - logging any unhandled errors in the application.

Googling didn't help me, so can anyone give me some ideas? I guess something in Redux or the Redux Toolkit catches the error, but I don't know what it does with the information.