diff --git a/magic-boot-ui/src/layout/layout.vue b/magic-boot-ui/src/layout/layout.vue
index a8f8188..677658b 100644
--- a/magic-boot-ui/src/layout/layout.vue
+++ b/magic-boot-ui/src/layout/layout.vue
@@ -54,8 +54,10 @@ import { ArrowDown } from '@element-plus/icons-vue'
 import Tabs from './tabs.vue'
 import Sidebar from './sidebar/sidebar.vue'
 import { logout } from '@/scripts/auth'
+import dynamicComponent from '@/scripts/dynamicComponent'
 import { getCurrentInstance } from 'vue'
 const { proxy } = getCurrentInstance()
+dynamicComponent(getCurrentInstance().appContext.app)
 </script>
 
 <style scoped>
@@ -67,7 +69,6 @@ const { proxy } = getCurrentInstance()
   }
   .title{
     font-family: PoetsenOne;
-    width: var(--mb-sidebar-width);
     line-height: 60px;
     font-size: 24px;
     color: white;
diff --git a/magic-boot-ui/src/main.js b/magic-boot-ui/src/main.js
index 725f958..7edf9ce 100644
--- a/magic-boot-ui/src/main.js
+++ b/magic-boot-ui/src/main.js
@@ -15,7 +15,6 @@ import App from './App.vue'
 import router from './scripts/router'
 import components from '@/components/index'
 import globalProperties from './scripts/globalProperties'
-import dynamicComponent from './scripts/dynamicComponent'
 import hasPermission from './scripts/hasPermission'
 
 import '@/permission'
@@ -34,7 +33,6 @@ router.beforeEach((to, from) => {
   return true
 })
 app.use(globalProperties)
-app.use(dynamicComponent)
 app.use(hasPermission)
 app.use(components)
 app.use(ElementPlus, {
diff --git a/magic-boot-ui/src/scripts/dynamicComponent.js b/magic-boot-ui/src/scripts/dynamicComponent.js
index 584144b..5e5d95c 100644
--- a/magic-boot-ui/src/scripts/dynamicComponent.js
+++ b/magic-boot-ui/src/scripts/dynamicComponent.js
@@ -1,5 +1,6 @@
 import { babelParse } from '@vue/compiler-sfc'
 import { compileFile } from '@/compiler/sfc-compiler.js'
+import { ElLoading } from 'element-plus'
 
 function appComponent(app, item){
     var compiled = {}
@@ -27,10 +28,15 @@ function appComponent(app, item){
 }
 
 const install = (app) => {
-    app.config.globalProperties.$post('/component/list', { size: 999999 }).then((res) => {
+    const loading = ElLoading.service({
+        lock: true,
+        background: 'rgba(255, 255, 255, 0)',
+    })
+    app.config.globalProperties.$post('/component/list').then((res) => {
         res.data.forEach(it => {
             appComponent(app, it)
         })
+        loading.close()
     })
 }
 export default install