chore: plugin-qiankun的demo

packages/fes-plugin-qiankun/examples/app1/.eslintrc.js

@@ -1,14 +0,0 @@
-module.exports = {
-    extends: ['@webank/eslint-config-webank/vue.js'],
-    overrides: [
-        {
-            files: [
-                '**/__tests__/*.{j,t}s?(x)',
-                '**/tests/unit/**/*.spec.{j,t}s?(x)'
-            ]
-        }
-    ],
-    env: {
-        jest: true
-    }
-};

packages/fes-plugin-qiankun/examples/app1/.gitignore

@@ -1,11 +0,0 @@
-.DS_Store
-
-# dependencies
-/node_modules
-/coverage
-
-# fes
-/src/.fes
-/src/.fes-production
-/src/.fes-test
-/.env.local

packages/fes-plugin-qiankun/examples/app1/LICENSE

@@ -1,21 +0,0 @@
-MIT License
-
-Copyright (c) 2020-present webank
-
-Permission is hereby granted, free of charge, to any person obtaining a copy
-of this software and associated documentation files (the "Software"), to deal
-in the Software without restriction, including without limitation the rights
-to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
-copies of the Software, and to permit persons to whom the Software is
-furnished to do so, subject to the following conditions:
-
-The above copyright notice and this permission notice shall be included in all
-copies or substantial portions of the Software.
-
-THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
-IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
-FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
-AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
-LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
-OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
-SOFTWARE.

packages/fes-plugin-qiankun/examples/main/.eslintrc.js

@@ -1,14 +0,0 @@
-module.exports = {
-    extends: ['@webank/eslint-config-webank/vue.js'],
-    overrides: [
-        {
-            files: [
-                '**/__tests__/*.{j,t}s?(x)',
-                '**/tests/unit/**/*.spec.{j,t}s?(x)'
-            ]
-        }
-    ],
-    env: {
-        jest: true
-    }
-};

packages/fes-plugin-qiankun/examples/main/.gitignore

@@ -1,11 +0,0 @@
-.DS_Store
-
-# dependencies
-/node_modules
-/coverage
-
-# fes
-/src/.fes
-/src/.fes-production
-/src/.fes-test
-/.env.local

packages/fes-plugin-qiankun/examples/main/LICENSE

@@ -1,21 +0,0 @@
-MIT License
-
-Copyright (c) 2020-present webank
-
-Permission is hereby granted, free of charge, to any person obtaining a copy
-of this software and associated documentation files (the "Software"), to deal
-in the Software without restriction, including without limitation the rights
-to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
-copies of the Software, and to permit persons to whom the Software is
-furnished to do so, subject to the following conditions:
-
-The above copyright notice and this permission notice shall be included in all
-copies or substantial portions of the Software.
-
-THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
-IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
-FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
-AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
-LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
-OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
-SOFTWARE.

packages/fes-plugin-qiankun/examples/micro/.fes.js

@@ -1,6 +1,4 @@
 // .fes.js 只负责管理编译时配置，只能使用plain Object
-
-
 export default {
     qiankun: {
         micro: {}

packages/fes-plugin-qiankun/examples/micro/package.json

@@ -1,5 +1,5 @@
 {
-    "name": "app1",
+    "name": "micro",
     "version": "2.0.0",
     "description": "fes项目模版",
     "scripts": {

packages/fes-plugin-qiankun/examples/micro/src/app.js

@@ -1,4 +1,4 @@
-import PageLoading from '@/components/PageLoading';
+import PageLoading from '@/components/PageLoading.vue';
 
 export const beforeRender = {
     loading: <PageLoading />,
@@ -8,24 +8,24 @@ export const beforeRender = {
                 resolve();
             }, 200);
         });
-    }
+    },
 };
 
 export const qiankun = {
     // 应用加载之前
     async bootstrap(props) {
-        console.log('app1 bootstrap', props);
+        console.log('micro bootstrap', props);
     },
     // 应用 render 之前触发
     async mount(props) {
-        console.log('app1 mount', props);
+        console.log('micro mount', props);
     },
     // 当 props 更新时触发
     async update(props) {
-        console.log('app1 update', props);
+        console.log('micro update', props);
     },
     // 应用卸载之后触发
     async unmount(props) {
-        console.log('app1 unmount', props);
+        console.log('micro unmount', props);
-    }
+    },
 };

packages/fes-plugin-qiankun/examples/micro/src/components/PageLoading.vue

@@ -8,16 +8,15 @@ import { FSpin } from '@fesjs/fes-design';
 
 export default {
     components: {
-        FSpin
+        FSpin,
     },
     setup() {
-        return {
+        return {};
-        };
+    },
-    }
 };
 </script>
 <style>
-.page-loading{
+.page-loading {
     position: fixed;
     top: 0;
     left: 0;

packages/fes-plugin-qiankun/examples/micro/src/pages/micro/index.vue

@@ -1,7 +1,5 @@
 <template>
-    <div class="haizekuo">
+    <div class="haizekuo">micro - index</div>
-        app1 - index
-    </div>
 </template>
 <config>
 {
@@ -12,11 +10,9 @@
 <script>
 export default {
     setup() {
-        return {
+        return {};
-        };
+    },
-    }
 };
 </script>
 
-<style scoped>
+<style scoped></style>
-</style>

packages/fes-plugin-qiankun/examples/micro/src/pages/micro/test.vue

@@ -1,7 +1,5 @@
 <template>
-    <div class="haizekuo">
+    <div class="haizekuo">micro - test</div>
-        app1 - test
-    </div>
 </template>
 <config>
 {
@@ -12,11 +10,9 @@
 <script>
 export default {
     setup() {
-        return {
+        return {};
-        };
+    },
-    }
 };
 </script>
 
-<style scoped>
+<style scoped></style>
-</style>

packages/fes-plugin-qiankun/examples/vite-main/.fes.js

@@ -0,0 +1,44 @@
+// .fes.js 只负责管理编译时配置，只能使用plain Object
+
+
+export default {
+    access: {
+        roles: {
+            admin: ["*"]
+        }
+    },
+    layout: {
+        title: "Fes.js",
+        footer: 'Created by MumbleFE',
+        multiTabs: false,
+        navigation: 'mixin',
+        menus: [{
+            name: 'index',
+        }, {
+            title: "子应用",
+            children: [{
+                name: 'micro-index'
+            },{
+                name: 'micro-test'
+            }]
+        }]
+    },
+    qiankun: {
+        main: {
+            apps: [
+                {
+                    name: 'micro', // 唯一 id
+                    entry: '//localhost:8001', // html entry
+                    props: {}  // 传递给子应用的数据
+                }
+            ]
+        }
+    },
+    plugins: [
+        require.resolve('../../../fes-build-vite/lib'),
+        require.resolve('../../../fes-plugin-model/lib'),
+        require.resolve('../../../fes-plugin-layout/lib'),
+        require.resolve('../../../fes-plugin-access/lib'),
+        require.resolve('../../../fes-plugin-qiankun/lib'),
+    ]
+};

packages/fes-plugin-qiankun/examples/vite-main/index.html

@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>
+        <%= title %>
+    </title>
+    <link rel="shortcut icon" type="image/x-icon" href="./logo.png">
+</head>
+
+<body>
+    <div id="<%= mountElementId %>"></div>
+</body>
+
+</html>

packages/fes-plugin-qiankun/examples/vite-main/package.json

@@ -44,7 +44,6 @@
     },
     "dependencies": {
         "@fesjs/fes": "^2.0.0",
-        "@fesjs/build-webpack": "^1.0.0",
         "vue": "^3.0.5",
         "@fesjs/fes-design": "^0.1.10"
     },

packages/fes-plugin-qiankun/examples/vite-main/src/app.jsx

@@ -1,5 +1,5 @@
 import { access as accessApi } from '@fesjs/fes';
-import PageLoading from '@/components/PageLoading';
+import PageLoading from '@/components/PageLoading.vue';
 
 export const beforeRender = {
     loading: <PageLoading />,
@@ -11,5 +11,5 @@ export const beforeRender = {
                 resolve();
             }, 1000);
         });
-    }
+    },
 };

packages/fes-plugin-qiankun/examples/vite-main/src/components/PageLoading.vue

@@ -8,16 +8,15 @@ import { FSpin } from '@fesjs/fes-design';
 
 export default {
     components: {
-        FSpin
+        FSpin,
     },
     setup() {
-        return {
+        return {};
-        };
+    },
-    }
 };
 </script>
 <style>
-.page-loading{
+.page-loading {
     position: fixed;
     top: 0;
     left: 0;

packages/fes-plugin-qiankun/examples/vite-main/src/pages/app1/index.vue

@@ -1,7 +1,7 @@
 <config>
 {
-    "name": "app1-index",
+    "name": "micro-index",
     "title": "子应用1-首页",
-    "microApp": "app1"
+    "microApp": "micro"
 }
 </config>

packages/fes-plugin-qiankun/examples/vite-main/src/pages/app1/test.vue

@@ -1,7 +1,7 @@
 <config>
 {
-    "name": "app1-test",
+    "name": "micro-test",
     "title": "子应用1-测试",
-    "microApp": "app1"
+    "microApp": "micro"
 }
 </config>

packages/fes-plugin-qiankun/examples/vite-main/src/pages/index.vue

@@ -3,14 +3,12 @@
         main
         <FTabs v-model="activeKey">
             <FTabPane name="Tab 1" value="1">
-                <MicroAppWithMemoHistory key="1" name="app1" url="/app1" />
+                <MicroAppWithMemoHistory key="1" name="micro" url="/micro" />
             </FTabPane>
             <FTabPane name="Tab 2" value="2">
-                <MicroAppWithMemoHistory key="2" name="app1" url="/app1/test" />
+                <MicroAppWithMemoHistory key="2" name="micro" url="/micro/test" />
-            </FTabPane>
-            <FTabPane name="Tab 3" value="3">
-                Content of Tab Pane 3
             </FTabPane>
+            <FTabPane name="Tab 3" value="3"> Content of Tab Pane 3 </FTabPane>
         </FTabs>
     </div>
 </template>
@@ -28,16 +26,16 @@ import { FTabPane, FTabs } from '@fesjs/fes-design';
 export default {
     components: { FTabs, FTabPane, MicroAppWithMemoHistory },
     setup() {
-        const url = ref('/app1/test');
+        const url = ref('/micro/test');
         onMounted(() => {
             setTimeout(() => {
-                url.value = '/app1';
+                url.value = '/micro';
             }, 3000);
         });
         return {
             activeKey: ref('1'),
-            url
+            url,
         };
-    }
+    },
 };
 </script>

packages/fes-plugin-qiankun/examples/webpack-main/.env

@@ -0,0 +1 @@
+PORT=8000

packages/fes-plugin-qiankun/examples/webpack-main/.fes.js

@@ -1,6 +1,4 @@
 // .fes.js 只负责管理编译时配置，只能使用plain Object
-
-
 export default {
     access: {
         roles: {
@@ -17,9 +15,9 @@ export default {
         }, {
             title: "子应用1",
             children: [{
-                name: 'app1-index'
+                name: 'micro-index'
             },{
-                name: 'app1-test'
+                name: 'micro-test'
             }]
         }]
     },
@@ -27,7 +25,7 @@ export default {
         main: {
             apps: [
                 {
-                    name: 'app1', // 唯一 id
+                    name: 'micro', // 唯一 id
                     entry: '//localhost:8001', // html entry
                     props: {}  // 传递给子应用的数据
                 }
@@ -35,6 +33,7 @@ export default {
         }
     },
     plugins: [
+        require.resolve('../../../fes-build-webpack/lib'),
         require.resolve('../../../fes-plugin-model/lib'),
         require.resolve('../../../fes-plugin-layout/lib'),
         require.resolve('../../../fes-plugin-access/lib'),

packages/fes-plugin-qiankun/examples/webpack-main/package.json

@@ -0,0 +1,51 @@
+{
+    "name": "main",
+    "version": "2.0.0",
+    "description": "fes项目模版",
+    "scripts": {
+        "build": "fes build",
+        "prod": "FES_ENV=prod fes build",
+        "analyze": "ANALYZE=1 fes build",
+        "dev": "fes dev",
+        "test": "fes test"
+    },
+    "keywords": [
+        "管理端",
+        "fes",
+        "fast",
+        "easy",
+        "strong"
+    ],
+    "files": [
+        ".eslintrc.js",
+        ".gitignore",
+        ".fes.js",
+        ".fes.prod.js",
+        "mock.js",
+        "package.json",
+        "README.md",
+        "tsconfig.json",
+        "/src",
+        "/config"
+    ],
+    "repository": {
+        "type": "git",
+        "url": "git+https://github.com/WeBankFinTech/fes.js.git",
+        "directory": "packages/fes-template"
+    },
+    "author": "harrywan",
+    "license": "MIT",
+    "bugs": {
+        "url": "https://github.com/WeBankFinTech/fes.js/issues"
+    },
+    "homepage": "https://github.com/WeBankFinTech/fes.js#readme",
+    "publishConfig": {
+        "access": "public"
+    },
+    "dependencies": {
+        "@fesjs/fes": "^2.0.0",
+        "vue": "^3.0.5",
+        "@fesjs/fes-design": "^0.1.10"
+    },
+    "private": true
+}

packages/fes-plugin-qiankun/examples/webpack-main/src/app.jsx

@@ -0,0 +1,15 @@
+import { access as accessApi } from '@fesjs/fes';
+import PageLoading from '@/components/PageLoading.vue';
+
+export const beforeRender = {
+    loading: <PageLoading />,
+    action() {
+        const { setRole } = accessApi;
+        return new Promise((resolve) => {
+            setTimeout(() => {
+                setRole('admin');
+                resolve();
+            }, 1000);
+        });
+    },
+};

packages/fes-plugin-qiankun/examples/webpack-main/src/components/PageLoading.vue

@@ -0,0 +1,29 @@
+<template>
+    <div class="page-loading">
+        <f-spin size="large" stroke="#5384ff" />
+    </div>
+</template>
+<script>
+import { FSpin } from '@fesjs/fes-design';
+
+export default {
+    components: {
+        FSpin,
+    },
+    setup() {
+        return {};
+    },
+};
+</script>
+<style>
+.page-loading {
+    position: fixed;
+    top: 0;
+    left: 0;
+    right: 0;
+    bottom: 0;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+}
+</style>

packages/fes-plugin-qiankun/examples/webpack-main/src/global.css

@@ -0,0 +1,3 @@
+html, body {
+    margin: 0;
+}

packages/fes-plugin-qiankun/examples/webpack-main/src/pages/index.vue

@@ -0,0 +1,41 @@
+<template>
+    <div>
+        main
+        <FTabs v-model="activeKey">
+            <FTabPane name="Tab 1" value="1">
+                <MicroAppWithMemoHistory key="1" name="micro" url="/micro" />
+            </FTabPane>
+            <FTabPane name="Tab 2" value="2">
+                <MicroAppWithMemoHistory key="2" name="micro" url="/micro/test" />
+            </FTabPane>
+            <FTabPane name="Tab 3" value="3"> Content of Tab Pane 3 </FTabPane>
+        </FTabs>
+    </div>
+</template>
+<config>
+{
+    "name": "index",
+    "title": "首页"
+}
+</config>
+<script>
+import { ref, onMounted } from 'vue';
+import { MicroAppWithMemoHistory } from '@fesjs/fes';
+import { FTabPane, FTabs } from '@fesjs/fes-design';
+
+export default {
+    components: { FTabs, FTabPane, MicroAppWithMemoHistory },
+    setup() {
+        const url = ref('/micro/test');
+        onMounted(() => {
+            setTimeout(() => {
+                url.value = '/micro';
+            }, 3000);
+        });
+        return {
+            activeKey: ref('1'),
+            url,
+        };
+    },
+};
+</script>

packages/fes-plugin-qiankun/examples/webpack-main/src/pages/micro/index.vue

@@ -0,0 +1,7 @@
+<config>
+{
+    "name": "micro-index",
+    "title": "子应用1-首页",
+    "microApp": "micro"
+}
+</config>

packages/fes-plugin-qiankun/examples/webpack-main/src/pages/micro/test.vue

@@ -0,0 +1,7 @@
+<config>
+{
+    "name": "micro-test",
+    "title": "子应用1-测试",
+    "microApp": "micro"
+}
+</config>

packages/fes-plugin-qiankun/examples/webpack-main/tsconfig.json

@@ -0,0 +1,37 @@
+{
+  "compilerOptions": {
+    "outDir": "build/dist",
+    "module": "esnext",
+    "target": "esnext",
+    "lib": ["esnext", "dom"],
+    "sourceMap": true,
+    "baseUrl": ".",
+    "jsx": "preserve",
+    "allowSyntheticDefaultImports": true,
+    "moduleResolution": "node",
+    "forceConsistentCasingInFileNames": true,
+    "noImplicitReturns": true,
+    "suppressImplicitAnyIndexErrors": true,
+    "noUnusedLocals": true,
+    "allowJs": true,
+    "skipLibCheck": true,
+    "experimentalDecorators": true,
+    "strict": true,
+    "paths": {
+      "@/*": ["./src/*"],
+      "@@/*": ["./src/.fes/*"]
+    }
+  },
+  "include": [
+    "src/**/*",
+    "tests/**/*",
+    "test/**/*",
+    "__test__/**/*",
+    "typings/**/*",
+    "config/**/*",
+    ".eslintrc.js",
+    ".stylelintrc.js",
+    ".prettierrc.js"
+  ],
+  "exclude": ["node_modules", "build", "dist", "scripts", "src/.fes/*", "webpack", "jest"]
+}

packages/fes-plugin-qiankun/package.json

@@ -8,8 +8,9 @@
   ],
   "scripts": {
     "start": "npm-run-all --parallel start:*",
-    "start:master": "cd ./examples/main && fes dev",
+    "start:vite-main": "cd ./examples/vite-main && fes dev",
-    "start:app1": "cd ./examples/app1 && fes dev"
+    "start:webpack-main": "cd ./examples/webpack-main && fes dev",
+    "start:micro": "cd ./examples/micro && fes dev"
   },
   "repository": {
     "type": "git",

packages/fes-plugin-qiankun/src/micro/index.js

@@ -19,117 +19,122 @@ export default function (api) {
         enableBy: () => isSlaveEnable(api),
     });
 
-    api.modifyDefaultConfig((memo) => {
+    if (api.builder.isVite) {
-        const initialMicroOptions = {
+        // 处理
-            devSourceMap: true,
+    } else {
-            ...JSON.parse(process.env.INITIAL_QIANKUN_MIRCO_OPTIONS || '{}'),
+        api.modifyDefaultConfig((memo) => {
-            ...(memo.qiankun || {}).micro,
+            const initialMicroOptions = {
-        };
+                devSourceMap: true,
-        const modifiedDefaultConfig = {
+                ...JSON.parse(process.env.INITIAL_QIANKUN_MIRCO_OPTIONS || '{}'),
-            ...memo,
+                ...(memo.qiankun || {}).micro,
-            qiankun: {
+            };
-                ...memo.qiankun,
+            const modifiedDefaultConfig = {
-                slave: initialMicroOptions,
+                ...memo,
+                qiankun: {
+                    ...memo.qiankun,
+                    slave: initialMicroOptions,
+                },
+            };
+
+            const shouldNotModifyDefaultBase = api.userConfig.qiankun?.slave?.shouldNotModifyDefaultBase ?? initialMicroOptions.shouldNotModifyDefaultBase;
+            if (!shouldNotModifyDefaultBase) {
+                modifiedDefaultConfig.router.base = `/${api.pkg.name}`;
+            }
+
+            return modifiedDefaultConfig;
+        });
+
+        const absRuntimePath = join(namespace, 'runtime.js');
+        const absLifecyclesPath = join(namespace, 'lifecycles.js');
+        const absMicroOptionsPath = join(namespace, 'slaveOptions.js');
+        const absPublicPath = join(namespace, 'publicPath.js');
+        const absModelPath = join(namespace, 'qiankunModel.js');
+
+        // 更改public path
+        api.addEntryImportsAhead(() => [{ source: `@@/${absPublicPath}` }]);
+
+        api.register({
+            key: 'addExtraModels',
+            fn: () => {
+                if (api.hasPlugins(['@fesjs/plugin-model'])) {
+                    return [
+                        {
+                            absPath: `@@/${absModelPath}`,
+                            namespace: qiankunStateFromMainModelNamespace,
+                        },
+                    ];
+                }
+                return [];
             },
-        };
-
-        const shouldNotModifyDefaultBase = api.userConfig.qiankun?.slave?.shouldNotModifyDefaultBase ?? initialMicroOptions.shouldNotModifyDefaultBase;
-        if (!shouldNotModifyDefaultBase) {
-            modifiedDefaultConfig.router.base = `/${api.pkg.name}`;
-        }
-
-        return modifiedDefaultConfig;
-    });
-
-    const absRuntimePath = join(namespace, 'runtime.js');
-    const absLifecyclesPath = join(namespace, 'lifecycles.js');
-    const absMicroOptionsPath = join(namespace, 'slaveOptions.js');
-    const absPublicPath = join(namespace, 'publicPath.js');
-    const absModelPath = join(namespace, 'qiankunModel.js');
-
-    // 更改public path
-    api.addEntryImportsAhead(() => [{ source: `@@/${absPublicPath}` }]);
-
-    api.register({
-        key: 'addExtraModels',
-        fn: () => {
-            if (api.hasPlugins(['@fesjs/plugin-model'])) {
-                return [
-                    {
-                        absPath: `@@/${absModelPath}`,
-                        namespace: qiankunStateFromMainModelNamespace,
-                    },
-                ];
-            }
-            return [];
-        },
-    });
-
-    api.onGenerateFiles(() => {
-        const HAS_PLUGIN_MODEL = api.hasPlugins(['@fesjs/plugin-model']);
-
-        api.writeTmpFile({
-            path: absRuntimePath,
-            content: readFileSync(join(__dirname, 'runtime/runtime.tpl'), 'utf-8'),
         });
 
-        api.writeTmpFile({
+        api.onGenerateFiles(() => {
-            path: absLifecyclesPath,
+            const HAS_PLUGIN_MODEL = api.hasPlugins(['@fesjs/plugin-model']);
-            content: Mustache.render(readFileSync(join(__dirname, 'runtime/lifecycles.tpl'), 'utf-8'), {
-                HAS_PLUGIN_MODEL,
-            }),
-        });
 
-        api.writeTmpFile({
-            path: absPublicPath,
-            content: `
-            if (window.__POWERED_BY_QIANKUN__) {
-                __webpack_public_path__ = window.__INJECTED_PUBLIC_PATH_BY_QIANKUN__;
-                window.public_path = window.__INJECTED_PUBLIC_PATH_BY_QIANKUN__;
-            }
-            `,
-        });
-
-        api.writeTmpFile({
-            path: absMicroOptionsPath,
-            content: `
-            let options = ${JSON.stringify((api.config.qiankun || {}).micro || {})};
-            export const getSlaveOptions = () => options;
-            export const setSlaveOptions = (newOpts) => options = ({ ...options, ...newOpts });
-            `,
-        });
-
-        if (HAS_PLUGIN_MODEL) {
             api.writeTmpFile({
-                path: absModelPath,
+                path: absRuntimePath,
-                content: readFileSync(join(__dirname, 'runtime/qiankunModel.tpl'), 'utf-8'),
+                content: readFileSync(join(__dirname, 'runtime/runtime.tpl'), 'utf-8'),
             });
-        }
-    });
 
-    api.addRuntimePlugin(() => `@@/${absRuntimePath}`);
+            api.writeTmpFile({
+                path: absLifecyclesPath,
+                content: Mustache.render(readFileSync(join(__dirname, 'runtime/lifecycles.tpl'), 'utf-8'), {
+                    HAS_PLUGIN_MODEL,
+                }),
+            });
 
-    api.chainWebpack((config) => {
+            api.writeTmpFile({
-        assert(api.pkg.name, 'You should have name in package.json');
+                path: absPublicPath,
-        config.output.libraryTarget('umd').library(`${api.pkg.name}-[name]`);
+                content: `
-        return config;
+                if (window.__POWERED_BY_QIANKUN__) {
-    });
+                    __webpack_public_path__ = window.__INJECTED_PUBLIC_PATH_BY_QIANKUN__;
+                    window.public_path = window.__INJECTED_PUBLIC_PATH_BY_QIANKUN__;
+                }
+                `,
+            });
 
-    api.addEntryImports(() => ({
+            api.writeTmpFile({
-        source: `@@/${absLifecyclesPath}`,
+                path: absMicroOptionsPath,
-        specifier: '{ genMount as qiankun_genMount, genBootstrap as qiankun_genBootstrap, genUnmount as qiankun_genUnmount, genUpdate as qiankun_genUpdate  }',
+                content: `
-    }));
+                let options = ${JSON.stringify((api.config.qiankun || {}).micro || {})};
+                export const getSlaveOptions = () => options;
+                export const setSlaveOptions = (newOpts) => options = ({ ...options, ...newOpts });
+                `,
+            });
 
-    api.addEntryCode(
+            if (HAS_PLUGIN_MODEL) {
-        () => `
+                api.writeTmpFile({
-export const bootstrap = qiankun_genBootstrap(clientRender, app);
+                    path: absModelPath,
-export const mount = qiankun_genMount('#${api.config.mountElementId}');
+                    content: readFileSync(join(__dirname, 'runtime/qiankunModel.tpl'), 'utf-8'),
-export const unmount = qiankun_genUnmount();
+                });
-export const update = qiankun_genUpdate();
+            }
+        });
 
-if (!window.__POWERED_BY_QIANKUN__) {
+        api.addRuntimePlugin(() => `@@/${absRuntimePath}`);
-    bootstrap().then(mount);
+
-}
+        api.chainWebpack((config) => {
-`,
+            assert(api.pkg.name, 'You should have name in package.json');
-    );
+            config.output.libraryTarget('umd').library(`${api.pkg.name}-[name]`);
+            return config;
+        });
+
+        api.addEntryImports(() => ({
+            source: `@@/${absLifecyclesPath}`,
+            specifier:
+                '{ genMount as qiankun_genMount, genBootstrap as qiankun_genBootstrap, genUnmount as qiankun_genUnmount, genUpdate as qiankun_genUpdate  }',
+        }));
+
+        api.addEntryCode(
+            () => `
+    export const bootstrap = qiankun_genBootstrap(clientRender, app);
+    export const mount = qiankun_genMount('#${api.config.mountElementId}');
+    export const unmount = qiankun_genUnmount();
+    export const update = qiankun_genUpdate();
+    
+    if (!window.__POWERED_BY_QIANKUN__) {
+        bootstrap().then(mount);
+    }
+    `,
+        );
+    }
 }