404 Not found console error for remote's bundled js file for views as application is looking for them in host app's domain

[mewdew]

Error:

_federation_expose…strap-BBGXVy30.js:8
GET http://localhost:8080/assets/HomeView-DaQAfwwj.js net::ERR_ABORTED 404 (Not Found)
_federation_expose…strap-BBGXVy30.js:8
GET http://localhost:8080/assets/__federation_fn_import-XvkDB2vd.js net::ERR_ABORTED 404 (Not Found)
_federation_expose…strap-BBGXVy30.js:8
GET http://localhost:8080/assets/index-D_QiqZUO.js net::ERR_ABORTED 404 (Not Found)
_federation_expose…strap-BBGXVy30.js:8
GET http://localhost:8080/assets/index-CxZ_qb5m.js net::ERR_ABORTED 404 (Not Found)
_federation_expose…strap-BBGXVy30.js:8

Versions:
vite: 6.0.1
vite-plugin-federation: 1.3.5

Host is running on 8080, below is the vite-config.ts:

import { fileURLToPath, URL } from "url";
import { defineConfig, loadEnv } from "vite";
import { configDefaults } from "vitest/config";
import vue from "@vitejs/plugin-vue";
import mockServer from "vite-plugin-mock-server";
import copy from "rollup-plugin-copy";
import { visualizer } from "rollup-plugin-visualizer";
import federation from "@originjs/vite-plugin-federation";
import { getEnvKey, remoteAppEntryUrlsEnvMap } from "./remoteAppUrls";
import { version } from "./package.json";

const getRemoteUrls = (env: any) => {
  console.log("Host Name: ", env.VITE_HOST_NAME);
  const envKey = getEnvKey(env.VITE_HOST_NAME);
  const appUrls = {};
  Object.keys(remoteAppEntryUrlsEnvMap[envKey]).map((appName) => {
    appUrls[remoteAppEntryUrlsEnvMap[envKey][appName]["remoteApp"]] = remoteAppEntryUrlsEnvMap[envKey][appName]["url"];
  });
  console.log("Remote App Urls: ", appUrls);
  return appUrls;
};

const getCurrentTimestampInEpoch = (): number => {
  return Math.floor(Date.now() / 1000);
};

// https://vitejs.dev/config/
export default defineConfig(({ mode }) => {
  // Load env file based on `mode` in the current working directory.
  // Set the third parameter to '' to load all env regardless of the `VITE_` prefix.
  const env = loadEnv(mode, process.cwd(), "");
  return {
    base: "/",
    server: {
      port: 8080
    },
    plugins: [
      federation({
        name: "host-app",
        remotes: getRemoteUrls(env),
        shared: ["vue", "vue-router", "pinia"]
      }),
      vue({
        template: {
          compilerOptions: {
            isCustomElement: (tag) => tag.startsWith("tc-")
          }
        }
      }),
      copy({
        targets: [
          {
            src: "node_modules/@xyz/icons/js/**/*",
            dest: "dist/assets/"
          }
        ],
        verbose: false,
        flatten: false,
        hook: "writeBundle" // After bundle has been written
      }),
      visualizer()
    ],
    build: {
      target: "esnext",
      minify: true,
      cssCodeSplit: false,
      rollupOptions: {
        output: {
          entryFileNames: `[name]-v${version}-${getCurrentTimestampInEpoch()}.js`,
          chunkFileNames: `[name]-v${version}-${getCurrentTimestampInEpoch()}.js`
        }
      }
    },
    resolve: {
      alias: {
        "@": fileURLToPath(new URL("./src", import.meta.url)),
        "@tests": fileURLToPath(new URL("./tests", import.meta.url)),
        "@public": fileURLToPath(new URL("./public", import.meta.url)),
        "@mock-server": fileURLToPath(new URL("./mock-server", import.meta.url))
      }
    }
  };
});

Remote is running on 7001, below is its vite.config.ts:

import { fileURLToPath, URL } from "url";
import { defineConfig } from "vite";
import { configDefaults } from "vitest/config";
import vue from "@vitejs/plugin-vue";
import gaPlugin from "@maersk-global/vite-plugin-google-analytics";
import mockServer from "vite-plugin-mock-server";
import copy from "rollup-plugin-copy";
import { visualizer } from "rollup-plugin-visualizer";
import federation from "@originjs/vite-plugin-federation";

// https://vitejs.dev/config/
export default defineConfig({
  base: "/",
  server: {
    port: 7001
  },
  plugins: [
    federation({
      name: "xyz-app",
      filename: "remoteEntry.js",
      // Modules to expose
      exposes: {
        "./bootstrap": "./src/bootstrap.ts"
      },
      shared: ["vue", "vue-router", "pinia"]
    }),
    vue({
      template: {
        compilerOptions: {
          isCustomElement: (tag) => tag.startsWith("tc-")
        }
      }
    }),
    copy({
      targets: [
        {
          src: "node_modules/@xyz-global/icons/js/**/*",
          dest: "dist/assets/"
        },
        {
          src: "node_modules/@xyz-global/xyz-design-tokens/**/*",
          dest: "dist/assets/"
        }
      ],
      verbose: false,
      flatten: false,
      hook: "writeBundle" // After bundle has been written
    }),
    visualizer()
  ],
  build: {
    target: "esnext",
    minify: true,
    cssCodeSplit: false
  },
  resolve: {
    alias: {
      "@": fileURLToPath(new URL("./src", import.meta.url)),
      "@tests": fileURLToPath(new URL("./tests", import.meta.url)),
      "@public": fileURLToPath(new URL("./public", import.meta.url)),
      "@mock-server": fileURLToPath(new URL("./mock-server", import.meta.url))
    }
  },
});