Browse Source

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
偏右 8 years ago
parent
commit
61c60a29e1
3 changed files with 50 additions and 14 deletions
  1. 1 0
      .webpackrc
  2. 48 13
      src/common/router.js
  3. 1 1
      src/rollbar.js

+ 1 - 0
.webpackrc

@@ -16,5 +16,6 @@
   "html": {
     "template": "./src/index.ejs"
   },
+  "disableDynamicImport": true,
   "hash": true
 }

+ 48 - 13
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 = {};

+ 1 - 1
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',