React Native 0.61 中引入的快速刷新不起作用答案

【问题标题】：Fast refresh that was introduced in React Native 0.61 doesn't workReact Native 0.61 中引入的快速刷新不起作用
【发布时间】：2021-11-01 19:53:40
【问题描述】：

（也发布在https://github.com/facebook/react-native/issues/27583）

更新：一天过去了，我再次启动了我的应用程序。自发布问题以来没有改变任何东西。现在它工作正常。不知道发生了什么... 从两个人将此问题标记为有用这一事实，我知道我不是唯一一个遇到此问题的人......

我正在使用 React native 0.61 运行一个非常基本的“应用程序”（单个文件、单个组件），其代码附在下面。

在带有 genymotion 的 Windows 10 上为 android 开发。

Fast Refresh 已开启，但似乎不起作用，例如，当：

我正在将“帖子”字符串更改为“新帖子”
当我删除帖子按钮时

只有调试菜单的“重新加载”会刷新应用并呈现更改。知道为什么吗？

代码如下：

import React, { useState } from 'react';
import { View, TouchableOpacity, Text, StyleSheet } from 'react-native';

export const App = () => {

  const [resource, setResource] = useState('todos');

  return (
    <View style={{ flex: 1, alignItems: 'center', marginTop: 30 }}>
      <View style={{ flexDirection: 'row', marginTop: 0,
        alignItems: 'center', justifyContent: 'center' }}>
        <TouchableOpacity onPress={() => (setResource('posts'))}>
          <View style={styles.button}>
            <Text style={styles.buttonText}>
              Posts
            </Text>
          </View>
        </TouchableOpacity>
        <View style={{ width: 20 }} />
        <TouchableOpacity onPress={() => setResource('todos')}>
          <View style={styles.button}>
            <Text style={styles.buttonText}>
              Todos
            </Text>
          </View>
        </TouchableOpacity>
      </View>
    </View>
  );
}

const styles = StyleSheet.create({
  buttonText: {
    color: 'black',
    fontSize: 20
  },
  button: {
    backgroundColor: '#a8a',
    justifyContent: 'center',
    alignItems: 'center',
    paddingVertical: 5,
    paddingHorizontal: 10,
    borderRadius: 2
  }
});

【问题讨论】：

您使用的是哪个平台？ Android 还是 iOS？
Android，在带有 genymotion 的 Windows 10 上。应该这么写的。我会更新的。
您是否尝试过创建一个新项目：react-native init example？
问题出在最近几天创建的新项目中。
你使用的是哪个节点版本的@Yossi？

标签： react-native

【解决方案1】：

我发现有时 Metro Bundler 会“卡住”。这可以解释为什么第二天运行它时它运行良好。

当事情因为（似乎）没有明显原因而变得奇怪时，我会这样做：

yarn start --reset-cache

【讨论】：

感谢您的回复。无法测试它，因为我现在没有问题...
有人吗？什么？
我试过了，但无济于事，甚至清理了 node_modules 并重新安装所有东西以及watchman watch-del-all 和/或重新安装 watchman，删除 .git/index.lock，从项目中删除所有 .lock 文件.每当我更改任何代码时，我都必须 --reset-cache 并重新安装以查看更改

【解决方案2】：

在我的情况下，我运行了watchman watch-del-all，突然我失去了快速重新加载。

重新安装 node_modules 并清除和重建应用程序对我没有帮助。

更新：一天过去了，我再次启动了我的应用程序。自发布问题以来没有改变任何东西。现在它工作正常。不知道发生了什么...

从中得到提示并重新启动我的计算机。现在它工作正常。

【讨论】：

【解决方案3】：

几分钟前我遇到了同样的问题。即使启用了快速刷新，它也不起作用。我关闭了 Metro 捆绑包并启动了新实例。为我工作。

【讨论】：