Snowpack & React：热重装/刷新不起作用

Posted 2023-02-16

【中文标题】Snowpack & React：热重装/刷新不起作用

【英文标题】：Snowpack & React: hot reloading / refreshing not working

【发布时间】：2021-02-06 12:11:55

【问题描述】：

我将 React 与 Snowpack 和 react-refresh plugin 一起使用。

更改后，snowpack 开发服务器重新编译正确，浏览器收到 HMR 更新信号 - 但内容没有重新加载，更改仅在手动重新加载页面后可见。

我已经用 Firefox、Chrome 和 Brave 进行了测试。

根据文档，除了包含插件之外，您无需配置任何其他内容。

有人有想法吗？ 将不胜感激！

【参考方案1】：

你的状态管理是 mobx 吗？

如果使用 mobx，组件会被观察者优化内存，因此必须更新 mobx 状态管理才能渲染。

换句话说，observer() 必须应用到 React.memo，并且只有在状态发生变化时才会再次渲染。

所以如果你使用useObserver(() => ) 它会起作用

【讨论】：

宾果，我居然用过mobx！你的解释听起来很有说服力，我想这就是问题所在。我已经从 Snowpack 切换到 Create React App，所以我无法确定地验证它 - 无论如何谢谢，也许它会帮助其他人！

其实我在执行的时候修改了代码，但是有一个问题没有改成一样的，所以我发现并确认解决了。

@KimKwangHoon 如果我尝试使用useObserver，它会给我以下错误：未捕获的错误：无效的挂钩调用。钩子只能在函数组件的主体内部调用。我正在做的是：export const HomePage = useObserver(() => //body )

@newbie 嗯... useObserver 的使用无效。您需要写 useObserver 作为回报，而不是要分配的部分。 ``` import useObserver, useLocalStore from 'mobx-react' // 6.x 或 mobx-react-lite@1.4.0 function Person() const person = useLocalStore(() => ( name: 'John ' )) return useObserver(() => ( person.name (person.name = 'Mike')>不！我是 Mike )) ```