Reactjs 控制台错误（[HMR] 正在等待来自 WDS 的更新信号...）

Question

我努力解决出现在 chrome 控制台中的这个错误。似乎是一个 webpack 错误 .. 但是在哪里解决它

[HMR] Waiting for update signal from WDS...

Answer 1

1. 转到node_modules -> webpack -> hot folder。

2. 在此之下，您将找到一个打开的log.js文件，用于编辑该部分（评论下的日志if(level === "info")）

   module.exports = function(level, msg){
   > comment start here
   
       if (shouldLog(level)) {
           if (level === "info") {
               console.log(msg);
           } else if (level === "warning") {
               console.warn(msg);
           } else if (level === "error") {
               console.error(msg);
           }
   
       }
   > comment end here
   };
   

有关更多信息： react-scripts 3.3.0 / 3.3.1 -> [HMR] 正在等待来自 WDS 的更新信号...在控制台中（Edge 仍不工作）#8153

Answer 2

正如对该问题的评论中所发布的，这不是一个错误。这也不是一个警告。

它只是让您知道，在开发过程中，当浏览器听到您所做的更改时，您的网页将自动重新加载（“热重新加载”）。一切顺利，这是您保存对源文件的更改的时候。

当您创建网站的生产版本时，它不应该出现（您应该在准备部署网站时执行此操作，因为许多内容都在生产版本中进行了优化）。

因此，控制台消息 [HMR] Waiting for update signal from WDS...仅意味着浏览器正在侦听来自 Webpack Developments Server 的任何更改，以便它可以执行热模块替换。

如果您按照其他答案中的建议注释掉日志代码，则会干扰第三方代码库，并且它将阻止其他日志记录，这可能会在以后引起问题。

我将其添加为答案，因为该答案重定向到此处，即使那里的答案更好并且此处的其他答案禁用了重要资源。

Answer 3

您可以从控制台中删除它

[HMR] Waiting for update signal from WDS...

您可以转到node_modules -> webpack ->热文件夹中的log.js文件在该文件下您将找到一个log.js文件，现在您必须使用ctrl+/.--

// if (shouldLog(level)) {
//  if (level === "info") {
//      console.log(msg);
//  } else if (level === "warning") {
//      console.warn(msg);
//  } else if (level === "error") {
//      console.error(msg);
//  }
// }

所以现在你的函数看起来像——

module.exports = function(level, msg) {
    // if (shouldLog(level)) {
    //  if (level === "info") {
    //      console.log(msg);
    //  } else if (level === "warning") {
    //      console.warn(msg);
    //  } else if (level === "error") {
    //      console.error(msg);
    //  }
    // }
};

并确保它npm start再次运行它会从控制台中删除。