知识点：

1. import * from '' 同步执行。
2. import(相对路径) 异步执行，返回Promise对象 自动 code-splitting(代码分割)

// 安装react-loadable 插件


import React from 'react';
import { HashRouter, Route, Switch, Redirect } from 'react-router-dom';
import Loadable from 'react-loadable';
import App from './App.js'; 
import Admin from './admin';
import Nomatch from './pages/nomatch/404';
import Home from './pages/home';

// 按路由拆分代码
const MyLoadingComponent = ({ isLoading, error }) => {
    if (isLoading) {
        return '加载中...'
    }
    else if (error) {
        return '页面出错了。。。';
    }
    else {
        return null;
    }
};

 
const BaseParts = Loadable({
    loader: () => import('./pages/baseParts'),
    loading: MyLoadingComponent
});

    

class Routers extends React.Component {

    render() {
        return (
            <HashRouter>
                <App>
                    <Switch> 
                        <Route path="/" render={() => 
                                <Switch>  
                                    <Route path="/product/baseParts" component={BaseParts}></Route> 
                                    <Redirect to="/home" />
                                    <Route component={Nomatch}></Route>
                                </Switch> 
                        }></Route>
                    </Switch>
                </App>
            </HashRouter>
        )
    }
}

export default Routers;