React StrictMode 组件和 babel config strictmode 是一回事吗？

Question

我想弄明白，这段代码有什么区别吗？

ReactDOM.render(
  <React.StrictMode>
     <App />
  </React.StrictMode>,
  document.getElementById('root')
);

还有这个babel配置

{
  "strictMode": true
}

如果我只使用 babel 配置和 strictMode:true 那么不需要 StrictMode 组件？反之亦然

Answer 1

StrictMode 是一种用于突出显示应用程序中潜在问题的工具。与 Fragment 一样，StrictMode 不会呈现任何可见的 UI。它为其后代激活额外的检查和警告。

如文档中所述

当元素包裹在 <React.StrictMode> 中时：

• 识别生命周期不安全的组件
• 关于遗留字符串引用 API 用法的警告
• 关于已弃用的 findDOMNode 用法的警告
• 检测意外的副作用
• 检测遗留上下文API

而babel中的strictMode是为ES6模块进行改造的。 ES6 模块有一个隐含的严格模式。 babel 的资源不多，但仅此而已。