修改 nacos-federation 插件，实现 接口请求基地址从 配置中心获取，并注入到环境变量中

front-end/app-product/.env.development

@@ -0,0 +1,24 @@
+# Nacos 配置中心ip:端口
+VITE_NACOS_ADDRESS=192.168.31.101:8848
+
+# traefik 网关的地址
+VITE_TRAEFIK_ADDRESS=192.168.31.101
+
+# 注册到 Nacos 的服务名称（微前端模块名称
+VITE_SERVER_NAME=app-product
+
+# 注册到 Nacos 的端口，也是前端运行的端口
+VITE_SERVER_PORT=1301
+
+
+#
+# 说明：项目要调用哪些 微前端 模块
+# 格式：VITE_MODEL_XXXX_NAME=微前端模块名称(模块 的 开发者提供)
+# 作用：通过名称从Nacos配置中心发现模块地址和端口，给 federation 实时加载
+#
+
+# shared 共享资源模块
+VITE_MODEL_SHARED_NAME=app-shared
+
+
+

front-end/app-product/.env.production

@@ -18,4 +18,7 @@ VITE_SERVER_PORT=1301
 #
 
 # shared 共享资源模块
-VITE_MODEL_SHARED_NAME=app-shared
+VITE_MODEL_SHARED_NAME=app-shared
+
+
+

front-end/app-product/src/App.tsx

@@ -1,4 +1,4 @@
-import {defineComponent} from 'vue'
+import { defineComponent } from 'vue'
 
 export default defineComponent({
     setup() {

front-end/app-product/src/features/product/router/index.ts

@@ -1,6 +1,5 @@
 import { RouteRecordRaw } from 'vue-router';
 
-
 export const productRouter: Array<RouteRecordRaw> = [
     {
         path: '/Products',

front-end/app-product/src/features/product/views/ProductDetail.tsx

@@ -1,7 +1,7 @@
-import {product} from '@domains/product/di/productModule';
-import {ProductType} from '@domains/product/domain/type/ProductType';
-import {defineComponent, onMounted, reactive} from 'vue'
-import {useRoute} from 'vue-router'
+import { product } from '@domains/product/di/productModule';
+import { ProductType } from '@domains/product/domain/type/ProductType';
+import { defineComponent, onMounted, reactive } from 'vue'
+import { useRoute } from 'vue-router'
 
 interface storeType {
     item: ProductType
@@ -36,13 +36,13 @@ export default defineComponent({
         return () => (
             <div class="ProductDetail">
                 <h1>商品领域模块 - 商品详情页面</h1>
-                <hr />
-                <p>商品id：{state.id}</p>
-                {state.item.name}
+                <hr/>
+                <p>商品id：{ state.id }</p>
+                { state.item.name }
                 <ul>
                     {
-                        Object.entries(state.item).map(([key, value]) =>
-                            <li>{key}: {value}</li>
+                        Object.entries(state.item).map(([ key, value ]) =>
+                            <li>{ key }: { value }</li>
                         )
                     }
                 </ul>

front-end/app-product/src/features/product/views/ProductList.tsx

@@ -1,7 +1,7 @@
-import {defineComponent, onMounted, reactive} from 'vue'
-import {useRouter} from 'vue-router';
-import {product} from '@domains/product/di/productModule';
-import {ProductType} from '@domains/product/domain/type/ProductType';
+import { defineComponent, onMounted, reactive } from 'vue'
+import { useRouter } from 'vue-router';
+import { product } from '@domains/product/di/productModule';
+import { ProductType } from '@domains/product/domain/type/ProductType';
 
 interface storeType {
     list: Array<ProductType>
@@ -30,18 +30,18 @@ export default defineComponent({
         return () => (
             <div class="ProductList">
                 <h1>商品领域模块 - 商品列表页面3</h1>
-                <hr />
+                <hr/>
                 <h2>从Deno 后端 加载的数据，点击进详情</h2>
                 <ul>
                     {
                         state.list.map(item =>
-                            <li key={item.id} onClick={() => {
+                            <li key={ item.id } onClick={ () => {
                                 router.push({
                                     name: 'ProductDetail',
                                     query: { id: item.id }
                                 });
-                            }}>
-                                {item.id} | {item.name} | ¥{item.price}
+                            } }>
+                                { item.id } | { item.name } | ¥{ item.price }
                             </li>
                         )
                     }