1. 程式人生 > >react路由按需載入方法

react路由按需載入方法

使用router4之後以前的按需載入方法require.ensure 是不好使了。

所以我們改用react-loadable外掛做按需載入。

第一步:

yarn add react-loadable --save-dev

第二步

建立一個 loadable檔案 程式碼如下:

import React from 'react';
import Loadable from 'react-loadable';

export default function withLoadable (comp) {
    return Loadable({
        loader:comp,
        loading:()
=>null, delay:0 }) }

路由這樣寫

import Bundle from './loadable';
const WrappedNormalLoginForm= Bundle(()=>import('./doLogin/dologin'));

···
   <Route exact path="/" component={WrappedNormalLoginForm}/> 
···

 

有不對的地方請多多指正