React组件动态加载

https://zh-hans.reactjs.org/docs/code-splitting.html#reactlazy

webpack配置：
plugins: [“@babel/plugin-syntax-dynamic-import”]

页面代码

const Test = React.lazy(() =>
    import(/* webpackChunkName: "Test" */ "../Test")
);
<Suspense fallback={<div>loading</div>}
    <Test />
</Suspense>

React.lazy 需要配合 Suspense 一起使用。上面的代码打包时会生成Test.hash.js（后缀名字webpack由配置）