feat: 增加qiankun的微前端依赖 以及处理了下 配置信息

.fes.js

@@ -4,7 +4,7 @@
  * @Autor: 地虎降天龙
  * @Date: 2023-10-16 10:53:09
  * @LastEditors: 地虎降天龙
- * @LastEditTime: 2025-03-18 19:03:02
+ * @LastEditTime: 2025-04-01 15:43:12
  */
 // import { resolve } from 'path';
 import { join } from 'path'
@@ -20,6 +20,7 @@ const timeStamp = new Date().getTime()
 const combinedIsCustomElement = (tag) => tag.startsWith('iconify-icon') || templateCompilerOptions.template.compilerOptions.isCustomElement(tag)
 
 export default defineBuildConfig({
+    mountElementId: 'tvt-app',
     title: 'TvT.js',
     publicPath: './',
     access: {
@@ -37,6 +38,11 @@ export default defineBuildConfig({
             ['1', '有效的'],
         ],
     },
+    qiankun: {
+        micro: {
+            useDevMode: true,
+        },
+    },
     //add by 地虎降天龙
     viteVuePlugin: {
         template: {
@@ -46,7 +52,7 @@ export default defineBuildConfig({
         },
     },
     viteOption: {
-        base: './', //     ./     /icegl-three-vue-tres/
+        base: './',
         plugins: [
             UnoCSS({
                 /* options */

package.json

@@ -56,6 +56,7 @@
     "@fesjs/plugin-layout": "5.4.6",
     "@fesjs/plugin-model": "3.0.3",
     "@fesjs/plugin-pinia": "^3.0.3",
+    "@fesjs/plugin-qiankun": "^3.1.6",
     "@fesjs/plugin-request": "^4.0.0-beta.6",
     "@fesjs/plugin-sass": "^3.0.0",
     "@here/quantized-mesh-decoder": "^1.2.8",

src/app.jsx

@@ -4,7 +4,7 @@
  * @Autor: 地虎降天龙
  * @Date: 2023-10-16 10:53:09
  * @LastEditors: 地虎降天龙
- * @LastEditTime: 2025-03-18 10:49:19
+ * @LastEditTime: 2025-04-01 10:43:48
  */
 import { defineRuntimeConfig, useModel } from '@fesjs/fes'
 import { FMenu } from '@fesjs/fes-design'
@@ -36,20 +36,8 @@ export default defineRuntimeConfig({
             if ((process.env.FES_APP_PLUGINS === 'true' && process.env.NODE_ENV === 'development') || process.env.FES_APP_ONLINE_API) {
                 getMenu()
             }
-            // return new Promise((resolve) => {
-            //     setTimeout(() => {
-            //         setRole('admin');
-            //         // 初始化应用的全局状态，可以通过 useModel('@@initialState') 获取，具体用法看@/components/UserCenter 文件
-            //         resolve({
-            //             userName: '李雷',
-            //         });
-            //     }, 1000);
-            // });
         },
     },
-    // layout: {
-    //     renderCustom: () => <UserCenter />,
-    // },
 })
 
 export function layout (layoutConfig) {
@@ -163,3 +151,22 @@ export function modifyRoute (memo) {
         ]
     }
 }
+
+export const qiankun = {
+    // 应用加载之前
+    async bootstrap (props) {
+        console.log('son TvT.js bootstrap', props)
+    },
+    // 应用 render 之前触发
+    async mount (props) {
+        console.log('son TvT.js mount', props)
+    },
+    // 当 props 更新时触发
+    async update (props) {
+        console.log('son TvT.js update', props)
+    },
+    // 应用卸载之后触发
+    async unmount (props) {
+        console.log('son TvT.js unmount', props)
+    },
+}

src/plugins/eCommerce/pages/electricFan.vue

@@ -4,7 +4,7 @@
  * @Autor: 地虎降天龙
  * @Date: 2024-01-16 08:58:24
  * @LastEditors: 地虎降天龙
- * @LastEditTime: 2024-03-22 11:15:02
+ * @LastEditTime: 2025-04-01 11:13:52
 -->
 <script setup lang="ts">
 import { OrbitControls } from '@tresjs/cientos'
@@ -39,13 +39,16 @@ const onClick = (color) => {
 	<div class="landingpage-bg w-full inset-0 h-full" />
 	<div class="absolute p-8 md:p-0 w-full inset-0 h-full
     flex flex-col md:flex-row md:justify-center md:items-center"
-		:style="{ backgroundColor: state.selectedColor + '80' }">
+		:style="{ backgroundColor: state.selectedColor + '80' }"
+>
 		<div class="w-full h-full pos-absolute md:w-2/3 md:h-1/2 shadow-lg rounded flex flex-col md:flex-row opacity-66"
-			:style="{ backgroundColor: oldColor }">
+			:style="{ backgroundColor: oldColor }"
+>
 			<div class="w-full h-full overflow-hidden pos-absolute">
 				<div ref="circleScaleRef" class="circleScale"
 					:class="{ circleScaleAnimationOld: circleScaleAnimation, circleScaleAnimationNew: !circleScaleAnimation }"
-					:style="{ backgroundColor: state.selectedColor }">
+					:style="{ backgroundColor: state.selectedColor }"
+>
 				</div>
 			</div>
 			<div class="h-1/2 w-full md:w-1/2" />
@@ -64,7 +67,8 @@ const onClick = (color) => {
 				<ul class="flex gap-8">
 					<li v-for="color in state.colors" :key="color">
 						<button class="w-10 h-10 rounded-full border-2 border-solid border-white mr-2 cursor-pointer"
-							:style="{ backgroundColor: color }" @click="onClick(color)" />
+							:style="{ backgroundColor: color }" @click="onClick(color)"
+/>
 					</li>
 				</ul>
 			</div>
@@ -87,7 +91,7 @@ const onClick = (color) => {
 </template>
 
 <style>
-#app {
+#tvt-app {
 	width: 100%;
 	height: 100vh;
 }

src/plugins/preview.vue

@@ -347,7 +347,7 @@ const openTopMune = () => {
 
 <style lang="less">
 @media (max-width: 900px) {
-    #app > section > div > header > div.fes-menu.is-horizontal.is-inverted.layout-menu {
+    #tvt-app > section > div > header > div.fes-menu.is-horizontal.is-inverted.layout-menu {
         display: none;
     }
     .fes-layout-container {