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
muslnode 18–226 runs
build_error
glibcnode 18–226 runs
build_error
Code
Verified usage
Verified import paths — ran on the pinned version, not inferred.
default import (reduxThunkFsa)
✓ import ReduxThunk from 'redux-thunk-fsa'
✗ import { ReduxThunk } from 'redux-thunk-fsa'
Package exports as default. Named import will not work.
createStore with middleware
✓ import { createStore, applyMiddleware } from 'redux';
import ReduxThunk from 'redux-thunk-fsa';
const store = createStore(reducer, applyMiddleware(ReduxThunk));
✗ const store = createStore(reducer, ReduxThunk); // Missing applyMiddleware
Middleware must be applied via applyMiddleware; directly passing to createStore is an error.
compose with middleware
✓ import { createStore, applyMiddleware, compose } from 'redux';
import ReduxThunk from 'redux-thunk-fsa';
const store = createStore(reducer, compose(applyMiddleware(ReduxThunk), window.__REDUX_DEVTOOLS_EXTENSION__?.()));
✗ const store = createStore(reducer, applyMiddleware(ReduxThunk), window.__REDUX_DEVTOOLS_EXTENSION__());
When using devtools with middleware, compose is required; wrong pattern passes middleware and enhancer as separate args.
TypeScript types
✓ import type { ThunkAction, ThunkDispatch } from 'redux-thunk-fsa'
✗ import { ThunkAction } from 'redux-thunk-fsa'
Types are exported as named exports alongside the default export. Use 'import type' for types.
Demonstrates basic Redux store setup with redux-thunk-fsa middleware and an async action creator returning a thunk.
import { createStore, applyMiddleware } from 'redux';
import ReduxThunk from 'redux-thunk-fsa';
// Example reducer
function counter(state = 0, action) {
switch (action.type) {
case 'INCREMENT':
return state + 1;
default:
return state;
}
}
// Async action creator returning a thunk
function incrementAsync() {
return (dispatch) => {
setTimeout(() => {
dispatch({ type: 'INCREMENT' });
}, 1000);
};
}
// Create store with thunk middleware
const store = createStore(counter, applyMiddleware(ReduxThunk));
// Dispatch async action
store.dispatch(incrementAsync());
console.log(store.getState()); // 0 initially, then 1 after 1 second
Errors
Common errors & fixes
TypeError: middleware is not a function
Passing middleware directly to createStore without applyMiddleware.
fixUse applyMiddleware: const store = createStore(reducer, applyMiddleware(ReduxThunk));
Cannot find module 'redux-thunk-fsa'
Module not installed, or import path is incorrect.
fixInstall with npm install redux-thunk-fsa and ensure import path is 'redux-thunk-fsa' (not 'redux-thunk').
Error: Actions must be plain objects. Use custom middleware for async actions.
Thunk middleware not applied; async action creator returned a function but middleware didn't handle it.
fixEnsure applyMiddleware(ReduxThunk) is used when creating the store.
Cannot read properties of undefined (reading 'dispatch')
Thunk function expects dispatch and getState as arguments, but they are undefined because middleware not applied or incorrectly configured.
fixVerify store creation includes applyMiddleware(ReduxThunk) and that the thunk is correctly passed to dispatch.
Audit
Dependencies
reduxoptionalPeer dependency; provides the store and dispatch mechanism middleware interacts with.