我在 Gatsby 项目中更新了一些 npm 包,现在我在控制台中看到了这个警告:
React-hot-loader: react-🔥-dom patch is not detected. React 16.6+ features may not work.
但是,当我查看源代码时,有一条评论:
// Actually everything works...
这个警告实际上意味着什么?这是我应该解决的问题还是就让它过去?
我在 Gatsby 项目中更新了一些 npm 包,现在我在控制台中看到了这个警告:
React-hot-loader: react-🔥-dom patch is not detected. React 16.6+ features may not work.
但是,当我查看源代码时,有一条评论:
// Actually everything works...
这个警告实际上意味着什么?这是我应该解决的问题还是就让它过去?
根据我上面的评论,看起来react-hot-loader
想要@hot-loader/react-dom
包而不是标准react-dom
:
就个人而言,我有点担心将其换掉,因为它react-dom
是任何react
基于应用程序的核心部分。此外,似乎基于一些链接问题和代码注释,这可能只是支持钩子等新react功能的短期解决方法。
所以我想有两种选择:
更新
您可以像这样禁用警告:
import { hot, setConfig } from 'react-hot-loader'
setConfig({
showReactDomPatchNotification: false
})
您需要@hot-loader/react-dom
根据您的 ReactJS 版本添加到您的项目中,注意以下命令:
yarn add @hot-loader/react-dom@[YOUR_REACT_VERSION]
然后需要在您的 Webpack 配置文件中为其添加解析别名:
resolve: {
alias: {
'react-dom': '@hot-loader/react-dom'
}
}
有关更多信息,请阅读其文档。
截至 2020 年夏季,这是Gatsby 的 GitHub 存储库上推荐的当前解决方案:
运行此命令 - 但单独运行此命令并不能解决问题:
npm install -D @hot-loader/react-dom
// or
yarn add -D @hot-loader/react-dom
修改gatsby-node.js
添加以下内容:
exports.onCreateWebpackConfig = ({ stage, actions }) => {
if (stage.startsWith("develop")) {
actions.setWebpackConfig({
resolve: {
alias: {
"react-dom": "@hot-loader/react-dom",
},
},
})
}
}
重新启动gatsby develop
。警告消失了。
所以这似乎是开发过程的产物。看起来在这种情况下该怎么做有一些来回。错误消息被注释掉,然后作为问题的修复添加回来:https : //github.com/gaearon/react-hot-loader/commit/efc3d6b5a58df77f6e0d5ca21bef54e8f8732070。
因此,看起来这是一个小警告,除非您需要特定功能,否则您可能没问题。
向维护者询问清楚这可能是个好主意,因为他们自己似乎有点困惑:)