@umijs/plugins 4.0.0-beta.7 → 4.0.0-canary.202200505.1

package/README.md

@@ -1,3 +1,6 @@
 # @umijs/plugins
 
-See our website [umijs](https://umijs.org) for more information.
+See our website [umijs](https://umijs.org) for more information.
+
+
+

package/dist/access.js

@@ -1,5 +1,139 @@
 "use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
 Object.defineProperty(exports, "__esModule", { value: true });
+const fs_1 = __importDefault(require("fs"));
+const path_1 = require("path");
+const withTmpPath_1 = require("./utils/withTmpPath");
 exports.default = (api) => {
-    api;
+    api.describe({
+        config: {
+            schema(joi) {
+                return joi.object();
+            },
+        },
+        enableBy: api.EnableBy.config,
+    });
+    api.onGenerateFiles(async () => {
+        // allow enable access without access file
+        const hasAccessFile = ['js', 'jsx', 'ts', 'tsx'].some((ext) => fs_1.default.existsSync((0, path_1.join)(api.paths.absSrcPath, `access.${ext}`)));
+        // runtime.tsx
+        api.writeTmpFile({
+            path: 'runtime.tsx',
+            content: `
+import React from 'react';${hasAccessFile
+                ? `
+import accessFactory from '@/access'
+import { useModel } from '@@/plugin-model';
+`
+                : ''}
+import { AccessContext } from './context';
+
+function Provider(props) {${hasAccessFile
+                ? `
+  const { initialState } = useModel('@@initialState');
+  const access = React.useMemo(() => accessFactory(initialState), [initialState]);
+`
+                : `
+  const access = {};
+`}
+  return (
+    <AccessContext.Provider value={access}>
+      { props.children }
+    </AccessContext.Provider>
+  );
+}
+
+export function accessProvider(container) {
+  return <Provider>{ container }</Provider>;
+}
+      `,
+        });
+        // index.tsx
+        api.writeTmpFile({
+            path: 'index.tsx',
+            content: `
+import React from 'react';
+import { AccessContext } from './context';
+import type { IRoute } from 'umi';
+
+export const useAccess = () => {
+  return React.useContext(AccessContext);
+};
+
+export interface AccessProps {
+  accessible: boolean;
+  fallback?: React.ReactNode;
+}
+export const Access: React.FC<AccessProps> = (props) => {
+  if (process.env.NODE_ENV === 'development' && typeof props.accessible !== 'boolean') {
+    throw new Error('[access] the \`accessible\` property on <Access /> should be a boolean');
+  }
+
+  return <>{ props.accessible ? props.children : props.fallback }</>;
+};
+
+export const useAccessMarkedRoutes = (routes: IRoute[]) => {
+  const access = useAccess();
+  const markdedRoutes: IRoute[] = React.useMemo(() => {
+    const process = (route, parentAccessCode) => {
+      const accessCode = route.access || parentAccessCode;
+
+      // set default status
+      route.unaccessible = ${api.config.access.strictMode ? 'true' : 'false'};
+
+      // check access code
+      if (typeof accessCode === 'string') {
+        const detector = access[route.access];
+
+        if (typeof detector === 'function') {
+          route.unaccessible = !detector(route);
+        } else if (typeof detector === 'boolean') {
+          route.unaccessible = !detector;
+        } else if (typeof detector === 'undefined') {
+          route.unaccessible = true;
+        }
+      }
+
+      // check children access code
+      if (route.routes) {
+        const isNoAccessibleChild = !route.routes.reduce((hasAccessibleChild, child) => {
+          process(child, accessCode);
+
+          return hasAccessibleChild || !child.unaccessible;
+        }, false);
+
+        // make sure parent route is unaccessible if all children are unaccessible
+        if (isNoAccessibleChild) {
+          route.unaccessible = true;
+        }
+      }
+
+      return route;
+    }
+
+    return routes.map(route => process(route));
+  }, [routes.length]);
+
+  return markdedRoutes;
+}
+      `,
+        });
+        // 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,168 +1,137 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-const utils_1 = require("@umijs/utils");
-const fs_1 = require("fs");
 const path_1 = require("path");
-const presets = {
-    antd: {
-        plugins: [
-            'isSameOrBefore',
-            'isSameOrAfter',
-            'advancedFormat',
-            'customParseFormat',
-            'weekday',
-            'weekYear',
-            'weekOfYear',
-            'isMoment',
-            'localeData',
-            'localizedFormat',
-        ],
-        replaceMoment: true,
-    },
-    antdv3: {
-        plugins: [
-            'isSameOrBefore',
-            'isSameOrAfter',
-            'advancedFormat',
-            'customParseFormat',
-            'weekday',
-            'weekYear',
-            'weekOfYear',
-            'isMoment',
-            'localeData',
-            'localizedFormat',
-            'badMutable',
-        ],
-        replaceMoment: true,
-    },
-};
-const getConfig = (api) => {
-    let { preset = 'antd', plugins, replaceMoment, } = api.userConfig.antdDayjs || {};
-    if (preset && presets[preset]) {
-        plugins = presets[preset].plugins;
-        replaceMoment = presets[preset].replaceMoment;
-    }
-    if (plugins)
-        plugins = plugins;
-    if (replaceMoment !== undefined)
-        replaceMoment = replaceMoment;
-    return {
-        plugins,
-        replaceMoment,
-    };
-};
-const DIR_NAME = 'plugin-antd';
+const plugin_utils_1 = require("umi/plugin-utils");
+const resolveProjectDep_1 = require("./utils/resolveProjectDep");
+const withTmpPath_1 = require("./utils/withTmpPath");
 exports.default = (api) => {
-    const opts = api.userConfig.antd;
-    // dayjs (by default)
-    const { dayjs = true } = opts;
+    let pkgPath;
+    try {
+        pkgPath =
+            (0, resolveProjectDep_1.resolveProjectDep)({
+                pkg: api.pkg,
+                cwd: api.cwd,
+                dep: 'antd',
+            }) || (0, path_1.dirname)(require.resolve('antd/package.json'));
+    }
+    catch (e) { }
     api.describe({
         config: {
             schema(Joi) {
                 return Joi.object({
+                    configProvider: Joi.object(),
+                    // themes
                     dark: Joi.boolean(),
                     compact: Joi.boolean(),
-                    config: Joi.object(),
-                    dayjs: Joi.alternatives(Joi.boolean(), Joi.object({
-                        preset: Joi.string(),
-                        plugins: Joi.array(),
-                        replaceMoment: Joi.boolean(),
-                    })),
+                    // babel-plugin-import
+                    import: Joi.boolean(),
+                    // less or css, default less
+                    style: Joi.string().allow('less', 'css'),
                 });
             },
         },
+        enableBy: api.EnableBy.config,
+    });
+    function checkPkgPath() {
+        if (!pkgPath) {
+            throw new Error(`Can't find antd package. Please install antd first.`);
+        }
+    }
+    api.modifyAppData((memo) => {
+        checkPkgPath();
+        const version = require(`${pkgPath}/package.json`).version;
+        memo.antd = {
+            pkgPath,
+            version,
+        };
+        return memo;
     });
-    // antd import
-    api.chainWebpack((memo) => {
-        function getUserLibDir({ library }) {
-            if (
-            // @ts-ignore
-            (api.pkg.dependencies && api.pkg.dependencies[library]) ||
-                // @ts-ignore
-                (api.pkg.devDependencies && api.pkg.devDependencies[library]) ||
-                // egg project using `clientDependencies` in ali tnpm
-                // @ts-ignore
-                (api.pkg.clientDependencies && api.pkg.clientDependencies[library])) {
-                return (0, utils_1.winPath)((0, path_1.dirname)(
-                // 通过 resolve 往上找，可支持 lerna 仓库
-                // lerna 仓库如果用 yarn workspace 的依赖不一定在 node_modules，可能被提到根目录，并且没有 link
-                utils_1.resolve.sync(`${library}/package.json`, {
-                    basedir: api.paths.cwd,
-                })));
-            }
-            return null;
+    api.modifyConfig((memo) => {
+        checkPkgPath();
+        // antd import
+        memo.alias.antd = pkgPath;
+        // moment > dayjs
+        if (memo.antd.dayjs) {
+            memo.alias.moment = (0, path_1.dirname)(require.resolve('dayjs/package.json'));
         }
-        memo.resolve.alias.set('antd', getUserLibDir({ library: 'antd' }) ||
-            (0, path_1.dirname)(require.resolve('antd/package.json')));
-        if (dayjs !== false) {
-            const { replaceMoment } = getConfig(api);
-            if (replaceMoment) {
-                memo.resolve.alias.set('moment', getUserLibDir({ library: 'dayjs' }) ||
-                    (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 = {
+                ...getThemeVariables(memo.antd),
+                ...memo.theme,
+            };
         }
         return memo;
     });
-    // dark mode
-    // compat mode
-    if ((opts === null || opts === void 0 ? void 0 : opts.dark) || (opts === null || opts === void 0 ? void 0 : opts.compact)) {
-        // support dark mode, user use antd 4 by default
-        const { getThemeVariables } = require('antd/dist/theme');
-        api.modifyDefaultConfig((config) => {
-            config.theme = Object.assign(Object.assign({}, getThemeVariables(opts)), config.theme);
-            return config;
-        });
-    }
-    if (dayjs !== false) {
-        api.onGenerateFiles({
-            fn: () => {
-                const { plugins } = getConfig(api);
-                const runtimeTpl = (0, fs_1.readFileSync)((0, path_1.join)(__dirname, '../templates/antd/dayjs.tpl'), 'utf-8');
-                api.writeTmpFile({
-                    path: 'plugin-antd/dayjs.tsx',
-                    content: utils_1.Mustache.render(runtimeTpl, {
-                        plugins,
-                        dayjsPath: (0, path_1.dirname)(require.resolve('dayjs/package.json')),
-                        dayjsPluginPath: (0, path_1.dirname)(require.resolve('antd-dayjs-webpack-plugin/package.json')),
-                    }),
-                });
-            },
-        });
-        api.addEntryCodeAhead(() => {
-            return [`import './${DIR_NAME}/dayjs.tsx'`];
-        });
-    }
+    api.modifyConfig((memo) => {
+        memo.theme = {
+            'root-entry-name': 'default',
+            ...memo.theme,
+        };
+        return memo;
+    });
     // babel-plugin-import
     api.addExtraBabelPlugins(() => {
-        return [
-            [
-                require.resolve('babel-plugin-import'),
-                {
-                    libraryName: 'antd',
-                    libraryDirectory: 'es',
-                    style: true,
-                },
-            ],
-        ];
+        const style = api.config.antd.style || 'less';
+        return api.config.antd.import && !api.appData.vite
+            ? [
+                [
+                    require.resolve('babel-plugin-import'),
+                    {
+                        libraryName: 'antd',
+                        libraryDirectory: 'es',
+                        style: style === 'less' ? true : 'css',
+                    },
+                    'antd',
+                ],
+            ]
+            : [];
     });
     // antd config provider
-    // TODO: use umi provider
-    if (opts === null || opts === void 0 ? void 0 : opts.config) {
-        api.onGenerateFiles({
-            fn() {
-                // runtime.tsx
-                const runtimeTpl = (0, fs_1.readFileSync)((0, path_1.join)(__dirname, '../templates/antd/runtime.tpl'), 'utf-8');
-                api.writeTmpFile({
-                    path: `${DIR_NAME}/runtime.tsx`,
-                    content: utils_1.Mustache.render(runtimeTpl, {
-                        config: JSON.stringify(opts === null || opts === void 0 ? void 0 : opts.config),
-                    }),
-                });
-            },
+    api.onGenerateFiles(() => {
+        if (!api.config.antd.configProvider)
+            return;
+        api.writeTmpFile({
+            path: `runtime.tsx`,
+            content: plugin_utils_1.Mustache.render(`
+import React from 'react';
+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.configProvider),
+            }),
         });
-        //TODO：Runtime Plugin
-        api.addRuntimePlugin(() => [
-            (0, path_1.join)(api.paths.absTmpPath, DIR_NAME, 'runtime.tsx'),
-        ]);
-    }
+    });
+    api.addRuntimePlugin(() => {
+        return api.config.antd.configProvider
+            ? [(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 && !api.appData.vite
+            ? []
+            : [
+                {
+                    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[];