Registry / web-framework / redux-sagas-injector

redux-sagas-injector

library1.1.5jsnpmunverified

A library for dynamically injecting Redux sagas at runtime, enabling code splitting and lazy loading of sagas. Version 1.1.5 supports redux-saga 1.x and provides helpers for HMR and SSR. Unlike manual store manipulation, it uses a central key-based tracking mechanism and works alongside redux-reducers-injector. It has a small API surface (createInjectSagasStore, injectSaga, injectSagaBulk, reloadSaga) and is popular in universal/isomorphic React apps. Release cadence is irregular; current version fixes security issues in dependencies. Key differentiators: built-in HMR support, context store usage, and compatibility with react-universal-component.

web-framework

npm install redux-sagas-injector

github ↗package ↗

INSTALL

IMPORT

SIG · REDUX-SAGAS-INJECT

redux-sagas-injector

web-frameworkjavascriptv1.1.5

harness data pending

Install & Compatibility

Where this runs

No compatibility data collected yet for this library.

Code

Verified usage

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

createInjectSagasStore

✓ import { createInjectSagasStore } from 'redux-sagas-injector'

✗ const createInjectSagasStore = require('redux-sagas-injector')

Library supports both ESM and CJS. Use named import for ESM; require will give an object with named exports.

injectSaga

✓ import { injectSaga } from 'redux-sagas-injector'

✗ import injectSaga from 'redux-sagas-injector'

Default import is not available; must use named import.

sagaMiddleware

✓ import { sagaMiddleware } from 'redux-sagas-injector'

✗ import sagaMiddleware from 'redux-sagas-injector/lib/sagaMiddleware'

sagaMiddleware is a pre-initialized middleware instance; no need to create your own with createSagaMiddleware.

reloadSaga

✓ import { reloadSaga } from 'redux-sagas-injector'

Used for HMR; accepts the same key as injectSaga and the new saga module.

injectSagaBulk

✓ import { injectSagaBulk } from 'redux-sagas-injector'

Accepts an array of objects with 'key' and 'saga' properties.

Demonstrates creating a store with injected sagas, injecting a saga later, and hot reloading. Uses TypeScript-style imports but works in JavaScript.

import { createStore, applyMiddleware, compose } from 'redux'; import { createInjectSagasStore, sagaMiddleware, reloadSaga, injectSaga } from 'redux-sagas-injector'; // Define a sample saga function* mySaga() { console.log('Saga started'); } // Create store with inject capability (replaces createStore) const rootReducer = (state = {}) => state; const store = createInjectSagasStore( { rootSaga: mySaga }, // initial sagas as object { key: sagaFunc } rootReducer, undefined, compose(applyMiddleware(sagaMiddleware)) ); // Inject additional saga later injectSaga('anotherSaga', function* () { console.log('Injected saga runs'); }); // HMR example (in module) if (module.hot) { module.hot.accept('./sagas', () => { const newSaga = require('./sagas').default; reloadSaga('rootSaga', newSaga); }); }

Debug

Known issues

breakingVersion 1.0.0 dropped support for redux-saga 0.x; saga must be a generator function or fork/race pattern. The old 0.2.x versions are incompatible with redux-saga 1.x.

fix

Upgrade redux-saga to 1.x and ensure all sagas are generator functions. Remove any legacy buffer or channel usage.

affects: >=1.0.0

deprecatedIn version 0.2.9, using transform-runtime for generators caused issues; the library reverted to 0.2.9 for generator compatibility. This is no longer relevant in v1.x.

fix

Upgrade to v1.0.0 or later to avoid transform-runtime conflicts.

affects: <=0.2.9

gotchainjectSaga with a duplicate key silently does nothing. There is no error or warning. This can lead to sagas not being replaced if you expect it to work like injectReducer for reducers.

fix

Use reloadSaga to replace an existing saga, or call injectSaga only once per key (e.g., in component lifecycle). If using React component, ensure injectSaga is called only on mount.

affects: *

gotchaThe sagaMiddleware exported by this library is a single instance. If you create multiple stores, they will share the same middleware instance, which may cause issues (e.g., sagas from one store influencing another).

fix

Only use one store per application, or create your own sagaMiddleware using createSagaMiddleware from redux-saga if you need multiple stores.

affects: *

deprecatedThe package uses deprecated dependency 'redux-reducers-injector' which has similar API. Consider using Redux Toolkit's dynamic reducers approach instead, as this library is not actively maintained (last release 2020).

fix

Evaluate migrating to Redux Toolkit's configureStore and dynamic middleware/reducer injection patterns.

affects: *

Errors

Common errors & fixes

Error: Actions must be plain objects. Use custom middleware for async actions.

Saga was not properly injected or the sagaMiddleware was not applied to the store. This often happens when using createStore instead of createInjectSagasStore, or when sagaMiddleware is not included in enhancers.

fix

Use createInjectSagasStore (not createStore) and ensure sagaMiddleware is in the applyMiddleware chain. Example:
const store = createInjectSagasStore({}, rootReducer, initialState, compose(applyMiddleware(sagaMiddleware)));

TypeError: sagaMiddleware.run is not a function

The sagaMiddleware imported from redux-sagas-injector is not a function; it's a pre-initialized middleware instance. Trying to call .run on it directly fails.

fix

Do not call sagaMiddleware.run(). The library handles running sagas internally via injectSaga. If you need to run a root saga manually, use createInjectSagasStore with initial sagas object.

Cannot find module 'redux-sagas-injector/lib/sagaMiddleware'

Trying to import from an internal path that does not exist in the library's published package. The sagaMiddleware is exported from the main entry point.

fix

Import as:
import { sagaMiddleware } from 'redux-sagas-injector';

injectSaga is not a function

Using default import instead of named import. The library does not have a default export.

fix

Use named import:
import { injectSaga } from 'redux-sagas-injector';

Upgrade

Version history

1.1.5latest on npm

Audit

Dependencies

reduxrequiredPeer dependency; requires a Redux store to inject sagas into.

redux-sagarequiredPeer dependency (version 1.x); injects sagas managed by redux-saga middleware.

redux-reducers-injectoroptionalOptional companion for injecting reducers alongside sagas; mentioned in docs as a pairing tool.

Agent activity

8 hits · last 30 days

node

OpenAI (training)

Resources

githubhttps://github.com/GuillaumeCisco/redux-sagas-injector ↗

packagehttps://www.npmjs.com/package/redux-sagas-injector ↗