React Native 热重载：“<Provider> 不支持动态更改 `store`”

Question

（React Native 版本 0.27.2）

我在模拟器中开启了“热重载”。当我进行更改时，例如添加调试 <Text> 元素，顶部出现灰色的“热加载”栏，并且以下内容记录到 Xcode 控制台：

 2016-06-16 09:47:52.276 [info][tid:com.facebook.react.JavaScript] [React Transform HMR] Patching _component
 2016-06-16 09:47:52.283 [info][tid:com.facebook.react.JavaScript] [React Transform HMR] Patching _component

此外，打包程序会记录以下内容：

[Hot Module Replacement] File change detected (9:47:49:334)
[Hot Module Replacement] File change detected (9:47:49:336)
[9:47:52 AM] <START> find dependencies
[9:47:52 AM] <START> find dependencies
[9:47:52 AM] <END>   find dependencies (0ms)
[9:47:52 AM] <END>   find dependencies (1ms)
[Hot Module Replacement] Sending HMR update to client (9:47:52:255)
[Hot Module Replacement] Sending HMR update to client (9:47:52:256)
[9:47:52 AM] <START> request:/ReactComponent/components/App.map?platform=ios&runModule=false&entryModuleOnly=true&hot=true
[9:47:52 AM] <START> find dependencies
[9:47:53 AM] <END>   find dependencies (837ms)
[9:47:53 AM] <END>   request:/ReactComponent/components/App.map?platform=ios&runModule=false&entryModuleOnly=true&hot=true (843ms)
[9:47:53 AM] <START> request:/ReactComponent/components/App.map?platform=ios&runModule=false&entryModuleOnly=true&hot=true
[9:47:53 AM] <END>   request:/ReactComponent/components/App.map?platform=ios&runModule=false&entryModuleOnly=true&hot=true (2ms)

但是，没有任何变化。文本元素不会出现，即使将其添加到我的最顶层元素也是如此。只有完全重新加载（模拟器中的Cmd+R）才会出现。

我可以检查哪些事情我可能做错了？

这是我的package.json：

{
  "name": "myappname",
  "version": "1.0.0",
  "private": true,
  "scripts": {
    "start": "(JS_DIR=`pwd`/ReactComponent; cd node_modules/react-native; npm run start -- --root $JS_DIR)"
  },
  "dependencies": {
    "react": "^15.1.0",
    "react-addons-update": "^15.1.0",
    "react-native": "^0.27.2",
    "react-native-navbar": "^1.5.0",
    "react-native-search-bar": "^2.11.0",
    "react-redux": "^4.4.5",
    "redux": "^3.5.2",
    "redux-logger": "^2.6.1",
    "redux-persist": "^3.2.2",
    "redux-thunk": "^1.0.3"
  }
}

---

更新 1

我很确定这与 Redux 有关。 https://facebook.github.io/react-native/releases/next/#redux-stores

但是，我已按照此处所述更新了我的商店创建代码。这是我的configureStore.js：

import { createStore, applyMiddleware, compose } from 'redux'
import thunk from 'redux-thunk'
import devTools from 'remote-redux-devtools'
import mainReducer from './reducers'
import {persistStore, autoRehydrate} from 'redux-persist'

export default function configureStore() {
    const enhancer = compose(applyMiddleware(thunk), devTools(), autoRehydrate())
    const store = createStore(mainReducer, undefined, enhancer)
    if (module.hot) {
        console.log("hot reload detected")
        if (module.hot.accept) {
          console.log("have accept")            
        }
        module.hot.accept(() => {
            console.log("replacing reducer...")            
            const nextRootReducer = require('./reducers/index').default
            store.replaceReducer(nextRootReducer)
        })
    } else {
        console.log("no hot reload???!")
    }
    persistStore(store)
    return store
}

我曾抱有希望，但现在每当我改变任何东西时，我都会收到消息

<Provider> does not support changing `store` on the fly. It is most
likely that you see this error because you updated to Redux 2.x and
React Redux 2.x which no longer hot reload reducers automatically.
See https://github.com/reactjs/react-redux/releases/tag/v2.0.0 
for the migration instructions.

日志输出“检测到热重载”和“接受”，但不是“更换减速器...”

Answer 1

我现在可以回答我自己的问题：问题是我有多个 RCTRootViews，每个都有自己的 bundle 实例，所以这导致创建了多个商店。它看起来像这样：

        let jsCode =
            NSURL(string: "http://10.10.11.60:8081/index.ios.bundle?platform=ios&dev=true")
        rootView = RCTRootView(bundleURL: jsCode, moduleName: self.moduleName, initialProperties:[:], launchOptions: nil)

一旦我将其更改为使用单个 RCTBridge 实例，这为我解决了这个问题（顺便说一句，还确保我的 Redux reducer 正确引导 connect()ed 组件重新渲染）：

 let jsCode =
NSURL(string: "http://10.10.11.60:8081/index.ios.bundle?platform=ios&dev=true")
 let singletonBridge = RCTBridge(bundleURL: jsCode, moduleProvider: nil, launchOptions: nil)
 ...
        rootView = RCTRootView(bridge: singletonBridge, moduleName: self.moduleName, initialProperties: [:])