9

这个问题在这里已经被问过好几次了(这里是最相关的另一个例子),但没有提出任何解决方案。所以我有两个问题要问你们:

  1. 知道为什么它在大型项目中不起作用吗?我的意思是,与项目大小或他包含的包相关的快速刷新是否存在任何已知问题会导致快速刷新停止工作?有什么办法可以解决吗?
  2. 有没有一种方便的方法可以在不使用快速刷新的情况下在应用程序中编辑内部页面(无需独立运行页面,因为它取决于应用程序的所有逻辑)?

这个bug真的让我的开发变得非常困难,我很难相信专业的开发人员没有找到解决这个问题的方法,请帮助!

我正在使用 expo-cli(v3.26.2 - Expo SDK 38 使用 react-native v0.62)

4

4 回答 4

19

TLDR;

使用没有名称的默认导出总是会导致应用程序完全重新加载而无需热重新加载!

细节

所以经过几个月的痛苦,我偶然发现了一个足够奇怪的效果:我通常用这种语法编写我的 react 组件:

export default ({ ...props }) => {
  ...
};

并且由于某种原因,更改以这种方式导出的模块总是会导致应用程序完全重新加载而无需热重新加载!

经过几个月的痛苦,我偶然发现将出口更改为:

const Test = ({ ...props }) => {
  ...
};

export default Test;

完全解决了这个问题,现在热重载工作得很好!
我没有在互联网上的一个地方看到过这种效果!

于 2020-12-12T01:40:04.400 回答
2

来自react-refresh-webpack-plugin故障排除部分

未命名/非帕斯卡命名的组件

有关未提供组件专有名称的缺点,请参阅此推文。它们是不可能支持的,因为我们无法静态地确定它们与 React 相关。其他 React 开发工具也存在这个问题,例如 hooks ESLint 插件。HOC 中的内部组件也必须符合此规则。

// Wont work
export default () => <div />;
export default function () {
return <div />;
}
export default function divContainer() {
return <div />;
}
于 2021-01-05T14:06:19.590 回答
2

还有另一种方法可以获得这种奇怪的行为。导出简单函数时:

//if we export this function in the entry file of the app,
//it will break the hot reload feature without any warnings.
export function someName() {
};

从您的应用程序的入口文件(使用打字稿模板expo init nameApp,该文件是 App.tsx)它将完全生成应用程序的完全重新加载,而不是热重新加载。

这是恶性的,因为在 ios 模拟器上它完全重新加载应用程序而不进行修改,而在 android 中它完全重新加载应用程序并进行修改。所以你需要一些时间才能意识到这不是 android 中的热重载,而是完全重载。

IDK为什么ios不像android那样显示修改..

但是当你思考这个问题时,我们不应该从应用程序的入口点导出多个东西。这听起来很奇怪不是吗?

于 2021-05-13T18:58:48.733 回答
0

TLDR;

在开发过程中,我遇到了无限“刷新...”消息的问题。以及诸如“未知解析模块 2”和“捆绑错误...”之类的难以理解的错误

细节

结果出乎意料,我在主 index.js 文件中将“require()”更改为“import”

const module = require('some-module')

import module from 'some-module';
于 2022-01-13T05:40:11.697 回答