From 3296a52ff3c6f575da4196476a8cfcd95bd66b9c Mon Sep 17 00:00:00 2001 From: Andre Torquato Date: Tue, 28 Oct 2025 17:22:14 -0300 Subject: [PATCH] feat: export remote with module federation bridge vue --- package-lock.json | 75 +++++++++++++++++++++++++++++++++++++-- package.json | 3 +- src/components/Header.vue | 6 ++-- src/export-app.ts | 8 +++++ vite.config.js | 2 +- 5 files changed, 87 insertions(+), 7 deletions(-) create mode 100644 src/export-app.ts diff --git a/package-lock.json b/package-lock.json index 00cf052..5637ddc 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,13 +1,14 @@ { "name": "mod-landing", - "version": "0.1.0", + "version": "0.2.0", "lockfileVersion": 3, "requires": true, "packages": { "": { "name": "mod-landing", - "version": "0.1.0", + "version": "0.2.0", "dependencies": { + "@module-federation/bridge-vue3": "^0.21.2", "@tailwindcss/vite": "^4.1.16", "lucide-vue-next": "^0.548.0", "pinia": "^2.0.28", @@ -1885,6 +1886,60 @@ "@jridgewell/sourcemap-codec": "^1.4.14" } }, + "node_modules/@module-federation/bridge-shared": { + "version": "0.21.2", + "resolved": "https://registry.npmjs.org/@module-federation/bridge-shared/-/bridge-shared-0.21.2.tgz", + "integrity": "sha512-qcpvx6KUgVNHVHuTOPU8e6lgRunxHiB4zqZkpMSb0MA8R+yuJturVZ7bz4Byydqy2ozCJjne/rWMg0Uo/Eh54A==", + "license": "MIT" + }, + "node_modules/@module-federation/bridge-vue3": { + "version": "0.21.2", + "resolved": "https://registry.npmjs.org/@module-federation/bridge-vue3/-/bridge-vue3-0.21.2.tgz", + "integrity": "sha512-Fs1mX/X0Vz7ZXQCsxqobKRrzGvEuYtUyf7YPGvxXXcjrcvpG/lSje7ORXgtx/oXM+g1xyAhg7qOsoo6etHQ7xQ==", + "license": "MIT", + "dependencies": { + "@module-federation/bridge-shared": "0.21.2", + "@module-federation/runtime": "0.21.2", + "@module-federation/sdk": "0.21.2" + }, + "peerDependencies": { + "vue": "=3", + "vue-router": "=4" + } + }, + "node_modules/@module-federation/bridge-vue3/node_modules/@module-federation/error-codes": { + "version": "0.21.2", + "resolved": "https://registry.npmjs.org/@module-federation/error-codes/-/error-codes-0.21.2.tgz", + "integrity": "sha512-mGbPAAApgjmQUl4J7WAt20aV04a26TyS21GDEpOGXFEQG5FqmZnSJ6FqB8K19HgTKioBT1+fF/Ctl5bGGao/EA==", + "license": "MIT" + }, + "node_modules/@module-federation/bridge-vue3/node_modules/@module-federation/runtime": { + "version": "0.21.2", + "resolved": "https://registry.npmjs.org/@module-federation/runtime/-/runtime-0.21.2.tgz", + "integrity": "sha512-97jlOx4RAnAHMBTfgU5FBK6+V/pfT6GNX0YjSf8G+uJ3lFy74Y6kg/BevEkChTGw5waCLAkw/pw4LmntYcNN7g==", + "license": "MIT", + "dependencies": { + "@module-federation/error-codes": "0.21.2", + "@module-federation/runtime-core": "0.21.2", + "@module-federation/sdk": "0.21.2" + } + }, + "node_modules/@module-federation/bridge-vue3/node_modules/@module-federation/runtime-core": { + "version": "0.21.2", + "resolved": "https://registry.npmjs.org/@module-federation/runtime-core/-/runtime-core-0.21.2.tgz", + "integrity": "sha512-LtDnccPxjR8Xqa3daRYr1cH/6vUzK3mQSzgvnfsUm1fXte5syX4ftWw3Eu55VdqNY3yREFRn77AXdu9PfPEZRw==", + "license": "MIT", + "dependencies": { + "@module-federation/error-codes": "0.21.2", + "@module-federation/sdk": "0.21.2" + } + }, + "node_modules/@module-federation/bridge-vue3/node_modules/@module-federation/sdk": { + "version": "0.21.2", + "resolved": "https://registry.npmjs.org/@module-federation/sdk/-/sdk-0.21.2.tgz", + "integrity": "sha512-t2vHSJ1a9zjg7LLJoEghcytNLzeFCqOat5TbXTav5dgU0xXw82Cf0EfLrxiJL6uUpgbtyvUdqqa2DVAvMPjiiA==", + "license": "MIT" + }, "node_modules/@module-federation/error-codes": { "version": "0.17.1", "resolved": "https://registry.npmjs.org/@module-federation/error-codes/-/error-codes-0.17.1.tgz", @@ -9298,6 +9353,22 @@ "node": ">=10" } }, + "node_modules/vue-router": { + "version": "4.6.3", + "resolved": "https://registry.npmjs.org/vue-router/-/vue-router-4.6.3.tgz", + "integrity": "sha512-ARBedLm9YlbvQomnmq91Os7ck6efydTSpRP3nuOKCvgJOHNrhRoJDSKtee8kcL1Vf7nz6U+PMBL+hTvR3bTVQg==", + "license": "MIT", + "peer": true, + "dependencies": { + "@vue/devtools-api": "^6.6.4" + }, + "funding": { + "url": "https://github.com/sponsors/posva" + }, + "peerDependencies": { + "vue": "^3.5.0" + } + }, "node_modules/vue-tsc": { "version": "3.1.1", "resolved": "https://registry.npmjs.org/vue-tsc/-/vue-tsc-3.1.1.tgz", diff --git a/package.json b/package.json index 6661496..5ae8e81 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "mod-landing", - "version": "0.1.0", + "version": "0.2.0", "type": "module", "private": true, "scripts": { @@ -15,6 +15,7 @@ "prepare": "husky" }, "dependencies": { + "@module-federation/bridge-vue3": "^0.21.2", "@tailwindcss/vite": "^4.1.16", "lucide-vue-next": "^0.548.0", "pinia": "^2.0.28", diff --git a/src/components/Header.vue b/src/components/Header.vue index f6c7cfd..b5175e0 100644 --- a/src/components/Header.vue +++ b/src/components/Header.vue @@ -11,14 +11,14 @@
- +
diff --git a/src/export-app.ts b/src/export-app.ts new file mode 100644 index 0000000..958b31f --- /dev/null +++ b/src/export-app.ts @@ -0,0 +1,8 @@ +import { createBridgeComponent } from "@module-federation/bridge-vue3"; +import App from "./App.vue"; + + +export default createBridgeComponent({ + rootComponent: App, + appOptions: () => {}, +}); \ No newline at end of file diff --git a/vite.config.js b/vite.config.js index 81459d0..49515a9 100644 --- a/vite.config.js +++ b/vite.config.js @@ -41,7 +41,7 @@ export default defineConfig(async ({ mode }) => { name: "landing", filename: "remoteEntry.js", exposes: { - "./Landing": "./src/App.vue", + "./Landing": "./src/export-app.ts", }, shared: {}, }),