React Native 0.47.1: Горячая перезагрузка не отражает изменения кода в MacOS

Я пытаюсь получить горячую перезагрузку с моим проектом React Native. Упаковщик показывает сообщение Bundling index.ios.js ... [hmr enabled], и когда я делаю изменения, я вижу сообщение Hot reloading... на устройстве, поэтому я уверен, что это изменение обнаружено. Однако фактический экран не отражает изменения кода. Живая перезагрузка отлично работает.

Я переустановил модули node и reset/uninstalled/reinstalled watchman. Ничто, кажется, не имеет никакого эффекта.

Что еще я должен попробовать? Как я могу понять, почему экран не обновляется?

Ответы

Ответ 1

Текущая версия hmr в react-native работает только для компонентов, которые простираются от React.Component или Component [см.]. Другими словами, он не работает для функциональных компонентов или компонентов, которые расширяют другой базовый класс.

Для функциональных компонентов вы можете использовать babel-plugin-functional-hmr.

Если у вас есть собственный базовый класс, вы можете переопределить плагин react-transform в .babelrc следующим образом:

{
  "presets": ["react-native"],
  "env": {
    "development": {
      "plugins": [
        ["react-transform",
          {
            "transforms": [{
              "transform": "react-transform-hmr",
              "imports": ["react"],
              "locals": ["module"]
            }],
            "superClasses": ["CustomComponent", "React.Component", "Component"]
          }
        ]
      ]
    }
  }
}