This plugin is very useful when developing the redux using redux-ducks
JavaScriptMIT
@mihanizm56/webpack-magic-redux-modules
Webpack loader to magically incapsulate your actions with the your module-name (folder name) prefix
Redux actions, sagas and reducers must be written in the example below (according to the RegExps below)
Files that are watched by replacers
// for actionsconstactionsRegExp=/actions\.[jt]s$/;// for reducersconstreducersRegExp=/reducer\.[jt]s$/;// for sagasconstsagasRegExp=/saga\.[jt]s$/;// for constantsconstconstantsRegExp=/_?constants\.[jt]s$/;
Example of usage
// actions.js (or .ts) in dir redux/some-module/actions.jsexportconstFETCH_PAYMENTS_ACTION_SAGA='FETCH_PAYMENTS_ACTION_SAGA';// 'FETCH_PAYMENTS_ACTION_SAGA' transforms to 'some-module_FETCH_PAYMENTS_ACTION_SAGA'exportconstfetchPaymentsActionSaga=payload=>({type: FETCH_PAYMENTS_ACTION_SAGA,
payload,});exportconstSET_PAYMENTS_LOADING_START='SET_PAYMENTS_LOADING_START';// 'SET_PAYMENTS_LOADING_START' transforms to 'some-module_SET_PAYMENTS_LOADING_START'exportconstsetPaymentsLoadingStartAction=()=>({type: SET_PAYMENTS_LOADING_START,});
// reducer.js (or .ts) in dir redux/some-module/reducer.jsexportconstREPORT_INFO_REDUCER_NAME='REPORT_INFO_REDUCER_NAME';// 'REPORT_INFO_REDUCER_NAME' transforms to 'some-module_REPORT_INFO_REDUCER_NAME'
// load-details-list-table-watcher-saga.js (or .ts) in dir redux/some-module/load-details-list-table-watcher-saga.js.jsexportconstLOAD_DETAILS_LIST_TABLE_WATCHER_SAGA='LOAD_DETAILS_LIST_TABLE_WATCHER_SAGA';// 'LOAD_DETAILS_LIST_TABLE_WATCHER_SAGA' transforms to 'some-module_LOAD_DETAILS_LIST_TABLE_WATCHER_SAGA'
// webpack.config.jsconstActionsLoaderConfig=require('@mihanizm56/@mihanizm56/webpack-magic-redux-modules/lib/loader-config');module.exports={// your config ...module: {rules: [// your rules ...ActionsLoaderConfig()]}};
Be careful - all redux modules must be placed in dir "redux" or "_redux"