redux-saga

library1.4.2jsnpmunverified

Redux-Saga is a middleware library for Redux, designed to manage application side effects (like asynchronous data fetching, accessing the browser cache, or impure actions) in a more organized and testable manner. It leverages ES6 Generators to make asynchronous flows look like synchronous code, improving readability and maintainability. The current stable version is 1.4.2, with patch releases occurring relatively frequently and minor versions every few months. Its key differentiators include its declarative effect model, powerful concurrency control patterns (e.g., `takeEvery`, `takeLatest`), and robust testing utilities, providing a structured alternative to Redux Thunk for complex side effect management.

web-framework testing

npm install redux-saga

github ↗package ↗homepage ↗

INSTALL

IMPORT

SIG · REDUX-SAGA

redux-saga

web-frameworkjavascriptv1.4.2

Install

—

Import

—

Disk

—

Pass rate

0/ 6

Env Coverage0 / 6

glibc

18–22

musl

18–22

Install & Compatibility

Where this runs

tested against v? · npm install

Install × environment matrix

Each cell = how many times install + import succeeded across repeated harness runs. Partial = flaky.
glibc = Debian/Ubuntu slim · musl = Alpine Linux

musl

node 18–226 runs

build_error

glibc

node 18–226 runs

build_error

Code

Verified usage

Verified import paths — ran on the pinned version, not inferred.

createSagaMiddleware

✓ import createSagaMiddleware from 'redux-saga';

✗ import { createSagaMiddleware } from 'redux-saga';

This is the default export of the main `redux-saga` package.

takeEvery

✓ import { takeEvery, put, call } from 'redux-saga/effects';

✗ import { takeEvery } from 'redux-saga';

Effect creators like `takeEvery`, `put`, `call`, `all` are imported from the `redux-saga/effects` submodule, not the main package.

Saga

✓ import type { Saga } from 'redux-saga';

✗ import { Saga } from 'redux-saga';

TypeScript types should be imported using `import type` for clarity and to avoid runtime issues if the type name clashes with a value.

This quickstart sets up a basic Redux store with `redux-saga` middleware. It demonstrates defining a simple counter reducer, creating an asynchronous saga using generator functions and effect creators (`call`, `put`, `takeEvery`), and running the saga with `sagaMiddleware.run()`.

import { createStore, applyMiddleware } from 'redux'; import createSagaMiddleware from 'redux-saga'; import { takeEvery, put, call } from 'redux-saga/effects'; // Reducer const counterReducer = (state = { count: 0 }, action) => { switch (action.type) { case 'INCREMENT': return { count: state.count + 1 }; case 'DECREMENT': return { count: state.count - 1 }; default: return state; } }; // Sagas function* incrementAsync() { yield call(delay, 1000); // Simulate an async operation yield put({ type: 'INCREMENT' }); } function* delay(ms) { return new Promise(res => setTimeout(res, ms)); } function* rootSaga() { yield takeEvery('INCREMENT_ASYNC', incrementAsync); } // Create saga middleware const sagaMiddleware = createSagaMiddleware(); // Create Redux store const store = createStore( counterReducer, applyMiddleware(sagaMiddleware) ); // Run sagas sagaMiddleware.run(rootSaga); // Dispatch actions store.dispatch({ type: 'INCREMENT_ASYNC' }); store.dispatch({ type: 'INCREMENT' }); // Log state changes store.subscribe(() => console.log(store.getState()));

Debug

Known issues

breakingThe `exports` field was added to `package.json` in v1.4.0. This change restricts what files can be directly imported from the package. While public APIs are maintained, any prior deep imports to non-public files might break.

fix

Ensure all imports are from the official public entry points (e.g., `redux-saga` or `redux-saga/effects`). Avoid importing directly from deep paths like `redux-saga/lib/utils/someInternalFile`.

affects: >=1.4.0

gotchaWhen using TypeScript, incorrect `moduleResolution` settings in `tsconfig.json` (e.g., 'bundler' or 'node') can lead to type compatibility issues, especially with older versions or specific bundler configurations.

fix

For `redux-saga@1.4.1+`, ensure `moduleResolution` is set appropriately, typically to `bundler` or `node`. If issues persist, review the `redux-saga` GitHub issues for specific `tsconfig.json` recommendations for your setup.

affects: >=1.0.0

breakingPrior to v1.0.0, the API for `createSagaMiddleware` and effect creators had different signatures and argument orders. Migrating from older `0.x` versions requires careful review of the migration guide.

fix

Consult the official `redux-saga` migration guide for detailed steps and breaking changes when upgrading from `0.x` to `1.x`.

affects: <1.0.0 to 1.x

gotchaUsing `sagaMiddleware.run()` multiple times with the same saga instance can lead to unintended behavior, as the saga will be started again. It's typically meant to be called once per root saga.

fix

Ensure `sagaMiddleware.run(rootSaga)` is called only once when initializing your application. If you need to restart or hot-reload sagas, consider using `sagaMiddleware.run(saga, ...args).toPromise()` to manage saga lifecycle.

affects: >=1.0.0

Errors

Common errors & fixes

TypeError: createSagaMiddleware is not a function

`createSagaMiddleware` is typically a default export from `redux-saga`.

fix

Change your import statement to `import createSagaMiddleware from 'redux-saga';` instead of `import { createSagaMiddleware } from 'redux-saga';`.

Error: takeEvery(pattern, saga): saga argument must be a Generator function!

The second argument passed to `takeEvery` (or similar effect creators) must be a generator function (e.g., `function* mySaga() { ... }`).

fix

Ensure the saga function passed to `takeEvery` is declared as a generator function, e.g., `function* myWorkerSaga() { yield put({ type: 'ACTION' }); }`.

TS2307: Cannot find module 'redux-saga/effects' or its corresponding type declarations.

This error often indicates incorrect `moduleResolution` in `tsconfig.json` or issues with package installation/bundler configuration, preventing TypeScript from finding the submodule types.

fix

Verify that `redux-saga` is correctly installed. Check your `tsconfig.json`'s `compilerOptions.moduleResolution` (e.g., try 'bundler' or 'node') and ensure `node_modules/@redux-saga/types` is accessible. Upgrading to `redux-saga@1.4.1` or newer might also help if you are on an older version with this issue.

effects must be plain objects, received [object Promise]

This error occurs when you use `await` or return a Promise directly from a saga without yielding an effect, or if you're not yielding a proper `redux-saga` effect object.

fix

Inside a saga, always `yield` effect creators from `redux-saga/effects` (e.g., `yield call(api.fetchData)` or `yield put({ type: 'ACTION' })`). Do not use `await` directly; use `yield call` for promise-based functions.

Upgrade

Version history

1.4.2latest on npm

Audit

Dependencies

reduxrequiredRequired as a peer dependency for integrating the saga middleware into a Redux store.

Agent activity

4 hits · last 30 days

node

Resources

githubhttps://github.com/redux-saga/redux-saga.git#main ↗

packagehttps://www.npmjs.com/package/redux-saga ↗

homepagehttps://redux-saga.js.org/ ↗