@umijs/plugins 4.0.0-beta.1 → 4.0.0-beta.13

package/dist/access.js

@@ -1,5 +1,77 @@
 "use strict";
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
 Object.defineProperty(exports, "__esModule", { value: true });
+const path_1 = require("path");
+const withTmpPath_1 = require("./utils/withTmpPath");
 exports.default = (api) => {
-    api;
+    // TODO: route access
+    api.describe({
+        config: {
+            schema(joi) {
+                return joi.object();
+            },
+        },
+        enableBy: api.EnableBy.config,
+    });
+    api.onGenerateFiles(() => __awaiter(void 0, void 0, void 0, function* () {
+        // runtime.tsx
+        api.writeTmpFile({
+            path: 'runtime.tsx',
+            content: `
+import React from 'react';
+import accessFactory from '@/access';
+import { useModel } from '@@/plugin-model';
+import { AccessContext } from './context';
+
+function Provider(props) {
+  const { initialState } = useModel('@@initialState');
+  const access = React.useMemo(() => accessFactory(initialState), [initialState]);
+  return (
+    <AccessContext.Provider value={access}>
+      { props.children }
+    </AccessContext.Provider>
+  );
+}
+
+export function accessProvider(container) {
+  return <Provider>{ container }</Provider>;
+}
+      `,
+        });
+        // index.ts
+        api.writeTmpFile({
+            path: 'index.ts',
+            content: `
+import React from 'react';
+import { AccessContext } from './context';
+
+export const useAccess = () => {
+  return React.useContext(AccessContext);
+};
+      `,
+        });
+        // context.ts
+        api.writeTmpFile({
+            path: 'context.ts',
+            content: `
+import React from 'react';
+export const AccessContext = React.createContext<any>(null);
+      `,
+        });
+    }));
+    api.addRuntimePlugin(() => {
+        return [(0, withTmpPath_1.withTmpPath)({ api, path: 'runtime.tsx' })];
+    });
+    api.addTmpGenerateWatcherPaths(() => [
+        (0, path_1.join)(api.paths.absSrcPath, 'access.ts'),
+        (0, path_1.join)(api.paths.absSrcPath, 'access.js'),
+    ]);
 };

package/dist/analytics.js

@@ -0,0 +1,67 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.default = (api) => {
+    const GA_KEY = process.env.GA_KEY;
+    const enableBy = (opts) => {
+        return opts.config.analytics || GA_KEY;
+    };
+    api.describe({
+        key: 'analytics',
+        config: {
+            schema(joi) {
+                return joi.object();
+            },
+            onChange: api.ConfigChangeType.reload,
+        },
+        enableBy,
+    });
+    // https://tongji.baidu.com/web/help/article?id=174&type=0
+    const baiduTpl = (code) => {
+        return `
+    (function() {
+      var hm = document.createElement('script');
+      hm.src = 'https://hm.baidu.com/hm.js?${code}';
+      var s = document.getElementsByTagName('script')[0];
+      s.parentNode.insertBefore(hm, s);
+    })();
+  `;
+    };
+    const gaTpl = (code) => {
+        return `
+    (function(){
+      if (!location.port) {
+        (function (i, s, o, g, r, a, m) {
+          i['GoogleAnalyticsObject'] = r;
+          i[r] = i[r] || function () {
+              (i[r].q = i[r].q || []).push(arguments)
+            }, i[r].l = 1 * new Date();
+          a = s.createElement(o),
+            m = s.getElementsByTagName(o)[0];
+          a.async = 1;
+          a.src = g;
+          m.parentNode.insertBefore(a, m)
+        })(window, document, 'script', '//www.google-analytics.com/analytics.js', 'ga');
+        ga('create', '${code}', 'auto');
+        ga('send', 'pageview');
+      }
+    })();
+  `;
+    };
+    api.addHTMLHeadScripts(() => {
+        const { analytics = {} } = api.config;
+        const { ga = GA_KEY, baidu } = analytics;
+        return [
+            baidu && {
+                content: 'var _hmt = _hmt || [];',
+            },
+            api.env !== 'development' &&
+                baidu && {
+                content: baiduTpl(baidu),
+            },
+            api.env !== 'development' &&
+                ga && {
+                content: gaTpl(ga),
+            },
+        ].filter(Boolean);
+    });
+};

package/dist/antd.js

@@ -1,11 +1,113 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
+const path_1 = require("path");
+const plugin_utils_1 = require("umi/plugin-utils");
+const resolveProjectDep_1 = require("./utils/resolveProjectDep");
+const withTmpPath_1 = require("./utils/withTmpPath");
 exports.default = (api) => {
-    api;
-    // antd import
-    // dark mode
-    // compat mode
-    // dayjs (by default?)
+    const pkgPath = (0, resolveProjectDep_1.resolveProjectDep)({
+        pkg: api.pkg,
+        cwd: api.cwd,
+        dep: 'antd',
+    }) || (0, path_1.dirname)(require.resolve('antd/package.json'));
+    api.describe({
+        config: {
+            schema(Joi) {
+                return Joi.object({
+                    configProvider: Joi.object(),
+                    // themes
+                    dark: Joi.boolean(),
+                    compact: Joi.boolean(),
+                    // babel-plugin-import
+                    import: Joi.boolean(),
+                    // less or css, default less
+                    style: Joi.string().allow('less', 'css'),
+                });
+            },
+        },
+        enableBy: api.EnableBy.config,
+    });
+    api.modifyAppData((memo) => {
+        const version = require(`${pkgPath}/package.json`).version;
+        memo.antd = {
+            pkgPath,
+            version,
+        };
+        return memo;
+    });
+    api.modifyConfig((memo) => {
+        // antd import
+        memo.alias.antd = pkgPath;
+        // moment > dayjs
+        if (memo.antd.dayjs) {
+            memo.alias.moment = (0, path_1.dirname)(require.resolve('dayjs/package.json'));
+        }
+        // dark mode & compact mode
+        if (memo.antd.dark || memo.antd.compact) {
+            const { getThemeVariables } = require('antd/dist/theme');
+            memo.theme = Object.assign(Object.assign({}, getThemeVariables(memo.antd)), memo.theme);
+        }
+        return memo;
+    });
     // babel-plugin-import
-    // antd config provider (HOLD, depends on umi)
+    api.addExtraBabelPlugins(() => {
+        const style = api.config.antd.style || 'less';
+        return api.config.antd.import
+            ? [
+                [
+                    require.resolve('babel-plugin-import'),
+                    {
+                        libraryName: 'antd',
+                        libraryDirectory: 'es',
+                        style: style === 'less' ? true : 'css',
+                    },
+                ],
+            ]
+            : [];
+    });
+    // antd config provider
+    api.onGenerateFiles(() => {
+        if (!api.config.antd.config)
+            return;
+        api.writeTmpFile({
+            path: `runtime.tsx`,
+            content: plugin_utils_1.Mustache.render(`
+import { ConfigProvider, Modal, message, notification } from 'antd';
+
+export function rootContainer(container) {
+  const finalConfig = {...{{{ config }}}}
+  if (finalConfig.prefixCls) {
+    Modal.config({
+      rootPrefixCls: finalConfig.prefixCls
+    });
+    message.config({
+      prefixCls: \`\${finalConfig.prefixCls}-message\`
+    });
+    notification.config({
+      prefixCls: \`\${finalConfig.prefixCls}-notification\`
+    });
+  }
+  return <ConfigProvider {...finalConfig}>{container}</ConfigProvider>;
+}
+      `.trim(), {
+                config: JSON.stringify(api.config.antd.config),
+            }),
+        });
+    });
+    api.addRuntimePlugin(() => {
+        return api.config.antd.config
+            ? [(0, withTmpPath_1.withTmpPath)({ api, path: 'runtime.tsx' })]
+            : [];
+    });
+    // import antd style if antd.import is not configured
+    api.addEntryImportsAhead(() => {
+        const style = api.config.antd.style || 'less';
+        return api.config.antd.import
+            ? []
+            : [
+                {
+                    source: style === 'less' ? 'antd/dist/antd.less' : 'antd/dist/antd.css',
+                },
+            ];
+    });
 };

package/dist/dva.d.ts

@@ -1,3 +1,6 @@
 import { IApi } from 'umi';
+import { Model, ModelUtils } from './utils/modelUtils';
 declare const _default: (api: IApi) => void;
 export default _default;
+export declare function getModelUtil(api: IApi | null): ModelUtils;
+export declare function getAllModels(api: IApi): Model[];

package/dist/dva.js

@@ -1,9 +1,174 @@
 "use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.getAllModels = exports.getModelUtil = void 0;
+const t = __importStar(require("@umijs/bundler-utils/compiled/babel/types"));
+const path_1 = require("path");
+const plugin_utils_1 = require("umi/plugin-utils");
+const modelUtils_1 = require("./utils/modelUtils");
+const withTmpPath_1 = require("./utils/withTmpPath");
 exports.default = (api) => {
-    api;
-    // import from dva
-    // model register
-    // container
+    const pkgPath = (0, path_1.join)(__dirname, '../libs/dva.ts');
+    api.describe({
+        config: {
+            schema(Joi) {
+                return Joi.object({
+                    extraModels: Joi.array().items(Joi.string()),
+                });
+            },
+        },
+        enableBy: api.EnableBy.config,
+    });
+    api.modifyAppData((memo) => {
+        const models = getAllModels(api);
+        memo.pluginDva = {
+            pkgPath,
+            models,
+        };
+        return memo;
+    });
+    api.modifyConfig((memo) => {
+        // import from dva
+        memo.alias.dva = pkgPath;
+        return memo;
+    });
+    api.onGenerateFiles((args) => {
+        const models = args.isFirstTime
+            ? api.appData.pluginDva.models
+            : getAllModels(api);
+        // models.ts
+        api.writeTmpFile({
+            path: 'models.ts',
+            content: modelUtils_1.ModelUtils.getModelsContent(models),
+        });
+        // dva.tsx
+        api.writeTmpFile({
+            path: 'dva.tsx',
+            tpl: `
+// It's faked dva
+// aliased to @umijs/plugins/templates/dva
+import { create, Provider } from 'dva';
+import React, { useRef } from 'react';
+import { useAppData } from 'umi';
+import { models } from './models';
+
+export function RootContainer(props: any) {
+  const { navigator } = useAppData();
+  const app = useRef<any>();
+  if (!app.current) {
+    app.current = create(
+      {
+        history: navigator,
+      },
+      {
+        initialReducer: {},
+        setupMiddlewares(middlewares: Function[]) {
+          return [...middlewares];
+        },
+        setupApp(app: IDvaApp) {
+          app._history = navigator;
+        },
+      },
+    );
+    for (const id of Object.keys(models)) {
+      app.current.model(models[id].model);
+    }
+    app.current.start();
+  }
+  return <Provider store={app.current!._store}>{props.children}</Provider>;
+}
+      `,
+            context: {},
+        });
+        // runtime.tsx
+        api.writeTmpFile({
+            path: 'runtime.tsx',
+            content: `
+import React from 'react';
+import { RootContainer } from './dva';
+
+export function dataflowProvider(container, opts) {
+  return React.createElement(RootContainer, opts, container);
+}
+      `,
+        });
+        // index.ts for export
+        api.writeTmpFile({
+            path: 'index.ts',
+            content: `
+export { connect, useDispatch, useStore, useSelector } from 'dva';`,
+        });
+    });
+    api.addTmpGenerateWatcherPaths(() => {
+        return [(0, path_1.join)(api.paths.absSrcPath, 'models')];
+    });
+    api.addRuntimePlugin(() => {
+        return [(0, withTmpPath_1.withTmpPath)({ api, path: 'runtime.tsx' })];
+    });
     // dva list model
+    api.registerCommand({
+        name: 'dva',
+        fn() {
+            api.logger.info(plugin_utils_1.chalk.green.bold('dva models'));
+            api.appData.pluginDva.models.forEach((model) => {
+                api.logger.info(`  - ${(0, path_1.relative)(api.cwd, model.file)}`);
+            });
+        },
+    });
 };
+function getModelUtil(api) {
+    return new modelUtils_1.ModelUtils(api, {
+        contentTest(content) {
+            return content.startsWith('// @dva-model');
+        },
+        astTest({ node, content }) {
+            if (isModelObject(node)) {
+                return true;
+            }
+            else if (content.includes('dva-model-extend') &&
+                t.isCallExpression(node) &&
+                node.arguments.length === 2 &&
+                isModelObject(node.arguments[1])) {
+                return true;
+            }
+            return false;
+        },
+    });
+}
+exports.getModelUtil = getModelUtil;
+function getAllModels(api) {
+    return getModelUtil(api).getAllModels({
+        extraModels: [...(api.config.dva.extraModels || [])],
+    });
+}
+exports.getAllModels = getAllModels;
+function isModelObject(node) {
+    return (t.isObjectExpression(node) &&
+        node.properties.some((property) => {
+            return [
+                'state',
+                'reducers',
+                'subscriptions',
+                'effects',
+                'namespace',
+            ].includes(property.key.name);
+        }));
+}

package/dist/initial-state.js

@@ -1,5 +1,116 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
+const withTmpPath_1 = require("./utils/withTmpPath");
 exports.default = (api) => {
-    api;
+    api.describe({
+        config: {
+            schema(Joi) {
+                return Joi.object({
+                    loading: Joi.string(),
+                });
+            },
+        },
+        enableBy: api.EnableBy.config,
+    });
+    api.register({
+        key: 'addExtraModels',
+        fn: () => [(0, withTmpPath_1.withTmpPath)({ api, path: '@@initialState.ts' })],
+    });
+    api.addRuntimePluginKey(() => ['getInitialState']);
+    api.addRuntimePlugin(() => {
+        return [(0, withTmpPath_1.withTmpPath)({ api, path: 'runtime.tsx' })];
+    });
+    api.onGenerateFiles(() => {
+        var _a;
+        const { loading } = api.config.initialState;
+        // Provider.tsx
+        api.writeTmpFile({
+            path: 'Provider.tsx',
+            content: `
+import React from 'react';
+import { useModel } from '@@/plugin-model';
+${loading
+                ? `import Loading from ${loading}`
+                : `function Loading() { return <div>loading</div>; }`}
+export default function InitialStateProvider(props: any) {
+  const appLoaded = React.useRef(false);
+  const { loading = false } = useModel("@@initialState") || {};
+  React.useEffect(() => {
+    if (!loading) {
+      appLoaded.current = true;
+    }
+  }, [loading]);
+  if (loading && !appLoaded.current) {
+    return <Loading />;
+  }
+  return props.children;
+}
+      `,
+        });
+        // @@initialState.ts
+        api.writeTmpFile({
+            path: '@@initialState.ts',
+            content: ((_a = api.appData.appJS) === null || _a === void 0 ? void 0 : _a.exports.includes('getInitialState'))
+                ? `
+import { useState, useEffect, useCallback } from 'react';
+import { getInitialState } from '@/app';
+
+const initState = {
+  initialState: undefined,
+  loading: true,
+  error: undefined,
+};
+
+export default () => {
+  const [state, setState] = useState(initState);
+  const refresh = useCallback(async () => {
+    setState((s) => ({ ...s, loading: true, error: undefined }));
+    try {
+      const ret = await getInitialState();
+      setState((s) => ({ ...s, initialState: ret, loading: false }));
+    } catch (e) {
+      setState((s) => ({ ...s, error: e, loading: false }));
+    }
+    // [?]
+    // await sleep(10);
+  }, []);
+
+  const setInitialState = useCallback(async (initialState) => {
+    setState((s) => {
+      if (typeof initialState === 'function') {
+        return { ...s, initialState: initialState(s.initialState), loading: false };
+      }
+      return { ...s, initialState, loading: false };
+    });
+    // [?]
+    // await sleep(10)
+  }, []);
+
+  useEffect(() => {
+    refresh();
+  }, []);
+
+  return {
+    ...state,
+    refresh,
+    setInitialState,
+  };
+}
+        `
+                : `
+export default () => ({ loading: false, refresh: () => {} })
+      `,
+        });
+        // runtime.tsx
+        api.writeTmpFile({
+            path: 'runtime.tsx',
+            content: `
+import React from 'react';
+import Provider from './Provider';
+export function innerProvider(container) {
+  return <Provider>{ container }</Provider>;
+}
+      `,
+        });
+    });
 };