{"id":17913,"library":"redux-replaceable-middleware","title":"Redux Replaceable Middleware","description":"Redux Replaceable Middleware is a utility that provides a mechanism to dynamically replace active Redux middleware instances at runtime. Published approximately 8 years ago, its current stable version is 1.1.0, and it appears to be abandoned, with no recent updates or active maintenance. This package was designed for earlier versions of Redux (specifically peer-depending on Redux v2, v3, or v4), and its core differentiation lies in enabling modification of the middleware chain after the Redux store has been created. In contrast, standard Redux practice involves defining the middleware chain once during store creation. Modern Redux applications, especially those using Redux Toolkit, typically manage asynchronous logic and side effects through patterns like Redux Thunk, Redux Saga, or Redux Toolkit's `createAsyncThunk` and listeners, rather than dynamic middleware replacement.","status":"abandoned","version":"1.1.0","language":"javascript","source_language":"en","source_url":"https://github.com/pgte/redux-replaceable-middleware","tags":["javascript","redux","middleware","replace"],"install":[{"cmd":"npm install redux-replaceable-middleware","lang":"bash","label":"npm"},{"cmd":"yarn add redux-replaceable-middleware","lang":"bash","label":"yarn"},{"cmd":"pnpm add redux-replaceable-middleware","lang":"bash","label":"pnpm"}],"dependencies":[{"reason":"Peer dependency for Redux store integration. Specifically targets Redux versions ^2.0.0 || ^3.0.0 || ^4.0.0.","package":"redux","optional":false}],"imports":[{"note":"This package is CommonJS-only. Attempting to use ES module `import` syntax will result in a runtime error. No default or named exports for ESM are provided.","wrong":"import ReplaceableMiddleware from 'redux-replaceable-middleware';","symbol":"ReplaceableMiddleware","correct":"const ReplaceableMiddleware = require('redux-replaceable-middleware');"},{"note":"The imported `ReplaceableMiddleware` is a factory function that must be called to create the actual middleware instance.","symbol":"ReplaceableMiddleware factory call","correct":"const myReplaceableMiddleware = ReplaceableMiddleware();"}],"quickstart":{"code":"const Redux = require('redux');\nconst ReplaceableMiddleware = require('redux-replaceable-middleware');\n\n// A dummy reducer\nconst reducer = (state = { value: 0 }, action) => {\n  switch (action.type) {\n    case 'INCREMENT':\n      return { ...state, value: state.value + 1 };\n    case 'DECREMENT':\n      return { ...state, value: state.value - 1 };\n    default:\n      return state;\n  }\n};\n\n// Initial middleware (logs actions)\nconst loggingMiddleware = store => next => action => {\n  console.log('OLD Middleware: Dispatching', action.type, 'payload:', action.payload);\n  const result = next(action);\n  console.log('OLD Middleware: Next state', store.getState());\n  return result;\n};\n\n// Create the replaceable middleware instance\nconst replaceableMiddleware = ReplaceableMiddleware(loggingMiddleware);\n\n// Create the store with the replaceable middleware\nconst store = Redux.createStore(\n  reducer,\n  Redux.applyMiddleware(replaceableMiddleware)\n);\n\nconsole.log('Initial state:', store.getState());\nstore.dispatch({ type: 'INCREMENT' });\n\n// New middleware (adds a prefix to action type)\nconst newMiddleware = store => next => action => {\n  console.log('NEW Middleware: Pre-processing action', action.type);\n  const newAction = { ...action, type: `PREFIX_${action.type}` };\n  const result = next(newAction);\n  console.log('NEW Middleware: Post-processing action', newAction.type);\n  return result;\n};\n\nconsole.log('\\nReplacing middleware in 1 second...');\nsetTimeout(() => {\n  replaceableMiddleware.replaceBy(newMiddleware);\n  console.log('Middleware replaced! Dispatching again...');\n  store.dispatch({ type: 'DECREMENT' });\n  store.dispatch({ type: 'INCREMENT' });\n  console.log('Final state:', store.getState());\n}, 1000);\n","lang":"javascript","description":"This quickstart demonstrates how to initialize the Redux store with `redux-replaceable-middleware` and then dynamically swap out an active middleware at runtime. It shows an initial logging middleware being replaced by one that modifies action types. This example uses CommonJS syntax consistent with the package's age."},"warnings":[{"fix":"Consider migrating to Redux Toolkit and using alternative patterns for dynamic logic, such as `createAsyncThunk`, `createListenerMiddleware`, or dynamically combining reducers/slices, rather than dynamically replacing middleware. If you must use dynamic middleware, explore modern alternatives like `@reduxjs/toolkit/query`'s listener middleware or `redux-dynamic-middlewares` (though also check its maintenance status).","message":"This package is designed for Redux versions 2.x, 3.x, and 4.x. It may not be compatible with Redux v5 or later, especially when used with Redux Toolkit's `configureStore`, which has different middleware handling.","severity":"breaking","affected_versions":">=5.0.0"},{"fix":"Always use `const ReplaceableMiddleware = require('redux-replaceable-middleware');` to import this package. If your project is ESM-only, you may need to use a CommonJS wrapper or reconsider using this abandoned package.","message":"This package is CommonJS-only and does not provide ES module exports. Attempting to use `import` statements will result in runtime errors in environments that enforce ESM.","severity":"gotcha","affected_versions":">=1.0.0"},{"fix":"Avoid using this package in new projects. For existing projects, evaluate the necessity of dynamic middleware replacement and consider migrating to actively maintained Redux patterns or libraries that achieve similar results in a more robust and supported manner.","message":"The package is effectively abandoned, with its last update being 8 years ago. It lacks maintenance, security updates, and compatibility with modern JavaScript features or contemporary Redux practices (e.g., Redux Toolkit, TypeScript).","severity":"deprecated","affected_versions":">=1.1.0"},{"fix":"If integrating into a TypeScript project, you will need to create a declaration file (e.g., `redux-replaceable-middleware.d.ts`) to provide types for `ReplaceableMiddleware` and its methods, or use `@ts-ignore` at import sites.","message":"This package does not ship with TypeScript type definitions. Using it in a TypeScript project will require manually declaring types or ignoring type errors, reducing type safety.","severity":"gotcha","affected_versions":">=1.0.0"}],"env_vars":null,"last_verified":"2026-04-23T00:00:00.000Z","next_check":"2026-07-22T00:00:00.000Z","problems":[{"fix":"Ensure you call the imported function to get the middleware: `const replaceableMiddleware = ReplaceableMiddleware();`","cause":"The imported `ReplaceableMiddleware` is a factory function, not the middleware itself. It must be called to create the middleware instance.","error":"TypeError: ReplaceableMiddleware is not a function"},{"fix":"If your project is ESM, you might need to run it in a CommonJS context, or use a dynamic `import()` statement if supported, though the package itself does not provide ESM exports. It's generally recommended to use actively maintained alternatives that support modern module systems.","cause":"Attempting to `require()` this CommonJS-only package within an ES module file, or trying to `import` it when the package only offers CommonJS exports.","error":"Error [ERR_REQUIRE_ESM]: require() of ES Module ... Not supported in ES module scope"},{"fix":"Ensure the middleware is correctly passed to `Redux.applyMiddleware` during store creation. The `options` object is populated by Redux and available within the middleware's `replaceBy` function or through `replaceableMiddleware.options` after the store is created.","cause":"The `replaceableMiddleware.options` property might not be set or accessed correctly, or the middleware was not properly applied to a Redux store.","error":"TypeError: Cannot read properties of undefined (reading 'dispatch')"}],"ecosystem":"npm","meta_description":null,"install_score":null,"install_tag":null,"quickstart_score":null,"quickstart_tag":null}