Question

我更喜欢浏览webify而不是webpack但是浏览器环境中存在一个我无法修复的问题。我正在使用react，redux和react-route，我愿意像反应热门加载器为webpack环境提供热模块重新加载。我正在使用livereactload来实现这一点（尝试了browserify-hmr）问题是它不适用于redux。它的redux示例（https://github.com/milankinen/livereactload/blob/master/examples/02-redux）不适用于新的克隆。有可能吗？有人可以给我应用示例所需的更改以使其有效吗？

P.S。看看这个问题https://github.com/milankinen/livereactload/issues/64

Answer 1

我正在使用它但是作为一个watchify插件：plugin（require（'livereactload'））并且它可以正常工作。

我确实更改了LiveReactload :: Bundle并更新了页面但是这个警告：browser.js：51警告：[react-router]你不能改变;它将被忽略。

仍然它“本地”重新加载，但它不是“真正的”热重新加载，因为许多东西仍然重新渲染，并没有达到我想要的那么多。

我们需要添加到配置存储的唯一内容如下：

export default function configureStore(initialState) {
  const store = createStoreWithMiddleware(rootReducer, initialState);

  // React hot reload
  if (module.onReload) {
    module.onReload(() => {
      const nextReducer = require('../reducers');
      store.replaceReducer(nextReducer.default || nextReducer);
      // return true to indicate that this module is accepted and
      // there is no need to reload its parent modules
      return true;
    });
  }

  return store;
}

Answer 2

我对doInBackground()的问题在于我没有使用redux或react-proxy@1.x，因此我的组件没有包含在代理中。如果您在没有babel-plugin-react-transform或react-proxy的情况下使用它，则新版本的livereactload会引发错误：https://github.com/milankinen/livereactload/issues/64#issuecomment-231992217

我对babel-plugin-react-transform的问题是我在Route指令中使用了一个定义为箭头函数的组件。显然react-route不支持这一点。它通过使用类组件而不是箭头函数来解决。这里的解释：https://github.com/milankinen/livereactload/issues/43#issuecomment-231990841

使用browserify，redux和react-route重新加载热模块

2 个答案: