React 16.8.0升级至18.1.0的入口渲染代码改造方法

React 18 版本已弃用旧版ReactDOM.render挂载API，改用createRoot作为标准根节点挂载入口，按以下方式改造即可：

• 调整导入逻辑：从react-dom/client路径导入createRoot方法，不再直接调用ReactDOM.render
• 先传入DOM根节点给createRoot，创建React根实例
• 调用根实例的render方法传入原有组件树即可，React.StrictMode、CubeProvider包裹App的组件层级逻辑无需修改

改造后的完整代码：

import { createRoot } from 'react-dom/client';

const rootElement = document.getElementById("root");
const root = createRoot(rootElement);
root.render(
  <React.StrictMode>
    <CubeProvider cubejsApi={cubejsApi}>
      <App />
    </CubeProvider>
  </React.StrictMode>
);

补充说明：如果在React 18中继续使用旧的ReactDOM.render写法，控制台会输出弃用警告，该API会在未来的React版本中被完全移除。新的createRoot写法默认启用React 18的并发渲染等新特性，不需要额外添加配置项。

内容的提问来源于stack exchange，提问作者Dhiman Saha