Currently, reducers are not hot reloading. You'll see the following console error when you change one:
[HMR] The following modules couldn't be hot updated: (Full reload needed)
[HMR] - ./src/redux/modules/auth.js
I'm not certain why this is the case. The base example project that this library is derived from works fine. Its serverOptions are unchanged (publicPath also resolves to the same):
var serverOptions = {
contentBase: 'http://' + host + ':' + port,
quiet: true,
noInfo: true,
hot: true,
inline: true,
lazy: false,
publicPath: webpackConfig.output.publicPath,
headers: {'Access-Control-Allow-Origin': '*'},
stats: {colors: true}
};
var app = new Express();
app.use(require('webpack-dev-middleware')(compiler, serverOptions));
app.use(require('webpack-hot-middleware')(compiler));
It assigns the following lines in src/redux/create.js
for hot reloading:
module.hot.accept('./modules/index', () => {
store.replaceReducer(require('./modules/index'));
});
An example of this reducer index:
import { combineReducers } from 'redux';
import auth from './auth';
import { routerStateReducer } from 'redux-router';
export default combineReducers({
auth,
router: routerStateReducer
});
universal-redux
allows the reducer index path to be configurable, which means I tried to modify it to the following, with an example of __REDUCER_INDEX__
being an absolute path like the following: /Users/d4/code/my-project/src/redux/modules/index.js
module.hot.accept(__REDUCER_INDEX__, () => {
store.replaceReducer(require(path.resolve(__REDUCER_INDEX__)));
});
But this provides the following error in the browser:
Uncaught SyntaxError: Invalid flags supplied to RegExp constructor 'd4'
I tried it with hard coded paths that make assumptions to the project directory, since universal-redux
is meant to be in node_modules
of the project:
module.hot.accept('./src/redux/modules/index', () => {
store.replaceReducer(require(path.resolve(__dirname, '../../../../src/redux/modules/index')));
});
But this gives the an error when starting up:
[0] Critical dependencies:
[0] 47:27-67 the request of a dependency is an expression
[0] @ ./~/universal-redux/lib/redux/create.js 47:27-67
...and does not reload reducers. I believe this is because the require statement is running from a different root than it used to.
Interestingly, the same error occurs even if I make a reducer inside of universal-redux
that lives relative to the create.js just like the previous project. It's as if the base path of the hot reloading server does not know where to base its search.