实现 nacos 的分布式集群部署配置

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

@@ -2,7 +2,7 @@
 VITE_PREFIX=http://
 
 # Nacos 配置中心ip:端口
-VITE_NACOS_ADDRESS=192.168.31.101:8848
+VITE_NACOS_ADDRESS=192.168.139.84:8848
 
 # traefik 网关的地址
 VITE_TRAEFIK_ADDRESS=192.168.31.101

front-end/main-app/src/app/main.ts

@@ -14,6 +14,9 @@ class Main {
            .use(router)
            .mount('#app')
 
+        // TODO 需要解决的地方
+        window.__APP_CONFIG__ = import.meta.env;
+
         elementPlus.init(app)
 
         initNormalizeStyles()
@@ -21,7 +24,6 @@ class Main {
     }
 }
 
-
 new Main
 
 

front-end/main-app/src/app/views/Home/Home.tsx

@@ -32,11 +32,11 @@ export default class Home extends Vue {
     ]
 
     async created() {
-        console.log("import.meta.env: ", import.meta.env)
+
     }
 
     async addCount() {
-        // console.log(await nacos.find('app-product'))
+        // console.log(await nacos-cluster.find('app-product'))
         // console.log("ref dom: ", this.refH1)
         // this.router.push({ name: 'about' })
         // this.route.query

front-end/main-app/src/shared/types/global.d.ts

@@ -0,0 +1,11 @@
+export interface AppConfig {
+    [key: string]: any;
+}
+
+declare global {
+    interface Window {
+        __APP_CONFIG__: AppConfig;
+    }
+}
+
+export {};

front-end/main-app/vite.config.ts

@@ -8,13 +8,13 @@ import { visualizer } from 'rollup-plugin-visualizer';
 
 export default defineConfig(async ({ mode }) => {
     const env = loadEnv(mode, process.cwd());
-    // const nacos = await nacosServiceManage.create({
+    // const nacos-cluster = await nacosServiceManage.create({
     //     serverList: env.VITE_NACOS_ADDRESS,
     //     serviceName: env.VITE_SERVER_NAME,
     //     port: Number(env.VITE_SERVER_PORT)
     // });
-    // const productUrl = await nacos.find(env.VITE_MODEL_PRODUCT_NAME)
-    // const sharedUrl = await nacos.find(env.VITE_MODEL_SHARED_NAME)
+    // const productUrl = await nacos-cluster.find(env.VITE_MODEL_PRODUCT_NAME)
+    // const sharedUrl = await nacos-cluster.find(env.VITE_MODEL_SHARED_NAME)
 
     return {
         server: {
@@ -38,8 +38,8 @@ export default defineConfig(async ({ mode }) => {
                     // 并把配置实时同步到Traefik中，如果 xxx微前端模块停止运行那么就会从 Nacos服务中注销，
                     // 那么dynamic.yml配置文件就会自动删减被下线的网关映射
 
-                    product: `http://${ env.VITE_TRAEFIK_ADDRESS }/${ env.VITE_MODEL_PRODUCT_NAME }/assets/remoteEntry.js`,
-                    shared: `http://${ env.VITE_TRAEFIK_ADDRESS }/${ env.VITE_MODEL_SHARED_NAME }/assets/remoteEntry.js`
+                    product: `${ env.VITE_PREFIX }${ env.VITE_TRAEFIK_ADDRESS }/${ env.VITE_MODEL_PRODUCT_NAME }/assets/remoteEntry.js`,
+                    shared: `${ env.VITE_PREFIX }${ env.VITE_TRAEFIK_ADDRESS }/${ env.VITE_MODEL_SHARED_NAME }/assets/remoteEntry.js`
                 },
                 shared: {
                     vue: { requiredVersion: '^3.5.18' },