feat: route插件优化

packages/fes-plugin-access/src/index.js

@@ -86,7 +86,18 @@ export default (api) => {
         utils: { Mustache }
     } = api;
 
-    api.addRuntimePluginKey(() => 'access');
+    api.describe({
+        config: {
+            schema(joi) {
+                return joi.object({
+                    roles: joi
+                        .object()
+                });
+            },
+            default: {
+            }
+        }
+    });
 
     const absoluteFilePath = join(namespace, 'core.js');
 

packages/fes-plugin-access/src/template/core.tpl

@@ -11,7 +11,7 @@ function isPromise(obj) {
 const state = reactive({
     roles: {{{REPLACE_ROLES}}},
     currentRoleId: "",
-    currentAccessIds: ["/"],
+    currentAccessIds: [],
 });
 
 const rolePromiseList = [];

packages/fes-plugin-access/src/template/runtime.tpl

@@ -1,4 +1,4 @@
-import { access } from './core';
+import { access } from "./core";
 
 export function onRouterCreated({ router }) {
     router.beforeEach(async (to, from, next) => {

packages/fes-plugin-built-in/src/index.js

@@ -5,11 +5,10 @@ export default [
     require.resolve('./plugins/registerMethods'),
 
     // misc
-    require.resolve('./plugins/misc/routes'),
+    require.resolve('./plugins/misc/route'),
 
     // generate files
     require.resolve('./plugins/generateFiles/core/plugin'),
-    require.resolve('./plugins/generateFiles/core/routes'),
     require.resolve('./plugins/generateFiles/core/exports/coreExports'),
     require.resolve('./plugins/generateFiles/core/exports/pluginExports'),
     require.resolve('./plugins/generateFiles/fes'),

packages/fes-plugin-built-in/src/plugins/generateFiles/core/plugin/index.js

@@ -18,6 +18,8 @@ export default function (api) {
             initialValue: [
                 'modifyClientRenderOpts',
                 'rootContainer',
+                // app生成时触发
+                'onAppCreated',
                 // 渲染
                 'render',
                 // 修改路由

packages/fes-plugin-built-in/src/plugins/generateFiles/core/routes/index.js

@@ -1,31 +0,0 @@
-import { readFileSync } from 'fs';
-import { join } from 'path';
-import { runtimePath } from '../../../../utils/constants';
-
-export default function (api) {
-    const {
-        utils: { Mustache }
-    } = api;
-
-    const absoluteFilePath = 'core/routes.js';
-
-    api.onGenerateFiles(async () => {
-        const routesTpl = readFileSync(join(__dirname, 'routes.tpl'), 'utf-8');
-        const routes = await api.getRoutesJSON();
-        api.writeTmpFile({
-            path: absoluteFilePath,
-            content: Mustache.render(routesTpl, {
-                runtimePath,
-                routes,
-                config: api.config
-            })
-        });
-    });
-
-    api.addCoreExports(() => [
-        {
-            specifiers: ['router'],
-            source: absoluteFilePath
-        }
-    ]);
-}

packages/fes-plugin-built-in/src/plugins/generateFiles/fes/fes.tpl

@@ -7,7 +7,7 @@ import {
 import { plugin } from './core/plugin';
 import './core/pluginRegister';
 import { ApplyPluginsType } from '{{{ runtimePath }}}';
-import { createRouter, getRoutes } from './core/routes';
+import { getRoutes } from './core/routes/routes';
 {{{ imports }}}
 
 {{{ entryCodeAhead }}}
@@ -24,9 +24,13 @@ const renderClient = (opts = {}) => {
         }
     });
 
-    const router = createRouter();
     const app = createApp(rootContainer);
-    app.use(router);
+    
+    plugin.applyPlugins({
+        key: 'onAppCreated',
+        type: ApplyPluginsType.event,
+        args: { app },
+    });
 
     // TODO other plugins install
     if (rootElement) {

packages/fes-plugin-built-in/src/plugins/misc/route/index.js

@@ -1,8 +1,9 @@
-import { readdirSync, statSync } from 'fs';
+import { readdirSync, statSync, readFileSync } from 'fs';
 import {
     join, extname, posix, basename
 } from 'path';
 import { lodash } from '@umijs/utils';
+import { runtimePath } from '../../../utils/constants';
 
 //   pages
 //  ├── index.vue         # 根路由页面 路径 /
@@ -230,4 +231,34 @@ export default function (api) {
             return getRoutesJSON({ routes, config: api.config });
         }
     });
+
+    const {
+        utils: { Mustache }
+    } = api;
+
+    const namespace = 'core/routes';
+
+    const absCoreFilePath = join(namespace, 'routes.js');
+
+    const absRuntimeFilePath = join(namespace, 'runtime.js');
+
+    api.onGenerateFiles(async () => {
+        const routesTpl = readFileSync(join(__dirname, 'template/routes.tpl'), 'utf-8');
+        const routes = await api.getRoutesJSON();
+        api.writeTmpFile({
+            path: absCoreFilePath,
+            content: Mustache.render(routesTpl, {
+                runtimePath,
+                routes,
+                config: api.config
+            })
+        });
+
+        api.writeTmpFile({
+            path: absRuntimeFilePath,
+            content: readFileSync(join(__dirname, 'template/runtime.tpl'), 'utf-8')
+        });
+    });
+
+    api.addRuntimePlugin(() => `@@/${absRuntimeFilePath}`);
 }

packages/fes-plugin-built-in/src/plugins/misc/route/template/routes.tpl

@@ -1,5 +1,5 @@
 import { createRouter as createVueRouter, createWebHashHistory, ApplyPluginsType } from '{{{ runtimePath }}}';
-import { plugin } from './plugin';
+import { plugin } from '@@/core/coreExports';
 
 export function getRoutes() {
   const routes = {{{ routes }}};
@@ -31,5 +31,3 @@ export const createRouter = () => {
 
   return router;
 };
-
-export { router } 

packages/fes-plugin-built-in/src/plugins/misc/route/template/runtime.tpl

@@ -0,0 +1,6 @@
+import { createRouter } from "./routes";
+
+export function onAppCreated({ app }) {
+    const router = createRouter();
+    app.use(router);
+}

packages/fes-template/.fes.js

@@ -2,4 +2,9 @@
 
 
 export default {
+    access: {
+        roles: {
+            admin: ["/", "/onepiece"]
+        }
+    }
 };

packages/fes-template/src/app.js

@@ -1,6 +1,6 @@
+import { access } from '@webank/fes';
 import PageLoading from '@/components/PageLoading.vue';
 
-
 /**
  * 获取用户信息比较慢的时候会展示一个 loading
  */
@@ -12,8 +12,10 @@ export const initialStateConfig = {
  * 设置页面初始化状态
  */
 export async function getInitialState() {
+    const { setRole } = access;
     const syncFunc = () => new Promise((resolve) => {
         setTimeout(() => {
+            setRole('admin');
             resolve({
                 a: 1,
                 b: 2

packages/fes-template/src/pages/index.vue

@@ -8,28 +8,24 @@
 <script>
 import { ref, onMounted } from 'vue';
 import {
-    useAccess, access, router, useModel
+    useAccess, useModel, useRouter
 } from '@webank/fes';
 
-const { setAccess } = access;
+
 export default {
     setup() {
         const fes = ref('fes upgrade to vue3');
         const accessOnepicess = useAccess('/onepiece');
         const { initialState } = useModel('@@initialState');
+        const router = useRouter();
         onMounted(() => {
-            console.log(initialState);
-            console.log('mounted1!!!');
             console.log(router);
-            setAccess(new Promise((resolve) => {
+            console.log(initialState.value);
-                setTimeout(() => {
+            console.log('mounted1!!');
-                    resolve(['/', '/onepiece']);
-                }, 3000);
-            }));
             // router.push('/onepiece');
         });
         onMounted(() => {
-            console.log('mounted2!!!');
+            console.log('mounted2!!');
         });
         return {
             fes,