loadable无效，大佬帮忙看看

Question

环境是webpack4
依赖是最新的
但是还是只有一个app.js

import React from 'react';
import ReactDOM from 'react-dom';
import { hot } from 'react-hot-loader';
import { HashRouter, Switch, Route } from 'react-router-dom';
import Loadable from 'react-loadable';
function loading() {
    console.log('--------------');
    return <div>loading</div>
}
const Home = Loadable({
    loader: () =>{
        console.log('11111111111111111');
        return import( /* webpackChunkName: "home" */ './components/Home')
    },
    loading: loading
});
const Page = Loadable({
    loader: () => {
        console.log("22222222222222222");
        return import(/* webpackChunkName: "page" */ './components/Page');
    },
    loading: loading
});
@hot(module)
class App extends React.Component {
    render() {
        return (
            <HashRouter>
                <Switch>
                    <Route exact path="/" component={Home}></Route>
                    <Route exact path="/Page" component={Page}></Route>
                </Switch>
            </HashRouter>
        )
    }
}
const render = () => {
    ReactDOM.render(
        <App></App>,
        document.querySelector("#app")
    )
}
render();

Answer 1

已经解决。
tsconfig.json内设置"module": "esNext",老的配置是"module": "commonjs"。而webpack只认识import方式导入模块。
这个问题困扰了我很久，重新学了了一遍webpack才有了思路。