From 61c60a29e1b03fe37bfd271cea1c81d63526cc54 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=81=8F=E5=8F=B3?= <afc163@gmail.com>
Date: Sun, 7 Jan 2018 18:09:46 +0800
Subject: [PATCH] Config code split (#562)

* change to one bundle first

* config code split by babel-plugin-dynamic-import-node-sync

* refactor

* Use roadbog disableDynamicImport

* fix typo

* Fix require default
---
 .webpackrc           |  1 +
 src/common/router.js | 61 ++++++++++++++++++++++++++++++++++----------
 src/rollbar.js       |  2 +-
 3 files changed, 50 insertions(+), 14 deletions(-)

diff --git a/.webpackrc b/.webpackrc
index 2aeef9d6..f47c4b72 100755
--- a/.webpackrc
+++ b/.webpackrc
@@ -16,5 +16,6 @@
   "html": {
     "template": "./src/index.ejs"
   },
+  "disableDynamicImport": true,
   "hash": true
 }
diff --git a/src/common/router.js b/src/common/router.js
index 69d33927..b88197d6 100644
--- a/src/common/router.js
+++ b/src/common/router.js
@@ -1,21 +1,56 @@
-import React from 'react';
+import { createElement } from 'react';
 import dynamic from 'dva/dynamic';
 import { getMenuData } from './menu';
 
+let routerDataCache;
+
+const modelNotExisted = (app, model) => (
+  // eslint-disable-next-line
+  !app._models.some(({ namespace }) => namespace === model)
+);
+
 // wrapper of dynamic
-const dynamicWrapper = (app, models, component) => dynamic({
-  app,
-  // eslint-disable-next-line no-underscore-dangle
-  models: () => models.filter(m => !app._models.some(({ namespace }) => namespace === m)).map(m => import(`../models/${m}.js`)),
-  // add routerData prop
-  component: () => {
-    const routerData = getRouterData(app);
-    return component().then((raw) => {
-      const Component = raw.default || raw;
-      return props => <Component {...props} routerData={routerData} />;
+const dynamicWrapper = (app, models, component) => {
+  // () => require('module')
+  // transformed by babel-plugin-dynamic-import-node-sync
+  if (component.toString().indexOf('.then(') < 0) {
+    models.forEach((model) => {
+      if (modelNotExisted(app, model)) {
+        // eslint-disable-next-line
+        app.model(require(`../models/${model}`).default);
+      }
     });
-  },
-});
+    return (props) => {
+      if (!routerDataCache) {
+        routerDataCache = getRouterData(app);
+      }
+      return createElement(component().default, {
+        ...props,
+        routerData: routerDataCache,
+      });
+    };
+  }
+  // () => import('module')
+  return dynamic({
+    app,
+    models: () => models.filter(
+      model => modelNotExisted(app, model)).map(m => import(`../models/${m}.js`)
+    ),
+    // add routerData prop
+    component: () => {
+      if (!routerDataCache) {
+        routerDataCache = getRouterData(app);
+      }
+      return component().then((raw) => {
+        const Component = raw.default || raw;
+        return props => createElement(Component, {
+          ...props,
+          routerData: routerDataCache,
+        });
+      });
+    },
+  });
+};
 
 function getFlatMenuData(menus) {
   let keys = {};
diff --git a/src/rollbar.js b/src/rollbar.js
index 21e0b3d8..f333309f 100644
--- a/src/rollbar.js
+++ b/src/rollbar.js
@@ -1,6 +1,6 @@
 import Rollbar from 'rollbar';
 
-// Track error by https://sentry.io/
+// Track error by rollbar.com
 if (location.host === 'preview.pro.ant.design') {
   Rollbar.init({
     accessToken: '033ca6d7c0eb4cc1831cf470c2649971',
-- 
GitLab