0.0.47-alpha • Published 1 year ago
@crux/redux-registry v0.0.47-alpha
@crux/redux-registry
@crux/redux-registry
is a tool to dynamically add and remove reducers and middleware. It was conceived to aid code-splitting.
It's very small, weighing-in <600B minified and gzipped.
Usage
First create the registries and add them to your store:
// ./store.ts
import { configureStore } from '@reduxjs/toolkit';
import { middlewareRegistry, reducerRegistry } from '@crux/redux-registry';
const mRegistry = middlewareRegistry();
const rRegistry = reducerRegistry();
const store = configureStore({
reducer: rRegistry.reducer,
middleware: (getDefaultMiddleware) =>
getDefaultMiddleware().concat(mRegistry.middleware),
});
export const addMiddleware = mRegistry.add;
export const addReducer = rRegistry.add;
Then in your application code:
import { addMiddleware, addReducer } from './store';
/**
* Example reducer that adds a user to a `data` array in the store.
*/
const usersReducer = (state, action) => {
switch (action.type) {
case 'addUser':
return {
...state,
data: [...state.data, action.payload]
};
}
}
const removeUsersReducer = addReducer('users', usersReducer);
/**
* Example middleware to log when a user is added.
*/
const loggerMiddleware = () => next => action => {
if (action.type === 'addUser') {
console.log(action);
}
}
const removeLoggerMiddleware = addMiddleware(loggerMiddleware);
Both addReducer
and addMiddleware
return a function that allows you to remove the reducer or middleware you added. So to clean up:
removeUsersReducer();
removeLoggerMiddleware();
0.0.47-alpha
1 year ago
0.0.46-alpha
2 years ago
0.0.45-alpha
2 years ago
0.0.40-alpha
2 years ago
0.0.41-alpha
2 years ago
0.0.42-alpha
2 years ago
0.0.43-alpha
2 years ago
0.0.44-alpha
2 years ago
0.0.37-alpha
2 years ago
0.0.39-alpha
2 years ago
0.0.36-alpha
2 years ago
0.0.38-alpha
2 years ago
0.0.35-alpha
2 years ago
0.0.34-alpha
2 years ago
0.0.33-alpha
2 years ago
0.0.32-alpha
2 years ago
0.0.31-alpha
2 years ago
0.0.30-alpha
2 years ago