From 3aa965bf9bea451c19f9e8d2156b27a3a4ac7c42 Mon Sep 17 00:00:00 2001 From: fengdanping Date: Fri, 15 Nov 2024 14:01:20 +0800 Subject: [PATCH] chore: add changeset --- .changeset/ten-games-suffer.md | 6 ++++ .../router-remote1-2001/rsbuild.config.ts | 8 ++--- .../bridge-react-webpack-plugin/src/utis.ts | 32 ++++++++++++------- .../bridge/bridge-react/src/router-v5.tsx | 2 +- .../bridge/bridge-react/src/router-v6.tsx | 3 +- packages/bridge/bridge-react/src/utils.ts | 1 - packages/bridge/bridge-react/vite.config.ts | 18 +++++------ 7 files changed, 43 insertions(+), 27 deletions(-) create mode 100644 .changeset/ten-games-suffer.md diff --git a/.changeset/ten-games-suffer.md b/.changeset/ten-games-suffer.md new file mode 100644 index 00000000000..bd78a4de674 --- /dev/null +++ b/.changeset/ten-games-suffer.md @@ -0,0 +1,6 @@ +--- +'@module-federation/bridge-react-webpack-plugin': patch +'@module-federation/bridge-react': patch +--- + +fix: wrap try catch with react-router-dom path resolve diff --git a/apps/router-demo/router-remote1-2001/rsbuild.config.ts b/apps/router-demo/router-remote1-2001/rsbuild.config.ts index fbb837ac1f5..7abeb0ebdc8 100644 --- a/apps/router-demo/router-remote1-2001/rsbuild.config.ts +++ b/apps/router-demo/router-remote1-2001/rsbuild.config.ts @@ -10,10 +10,10 @@ export default defineConfig({ react: path.resolve(__dirname, 'node_modules/react'), 'react-dom': path.resolve(__dirname, 'node_modules/react-dom'), // set `react-router-dom/` to reference react-router-dom v5 which shoule be find in node_modules/react-router-dom, otherwise it will cause app.tsx fail to work which in react-router-dom v5 mode. - 'react-router-dom': path.resolve( - __dirname, - 'node_modules/react-router-dom', - ), + // 'react-router-dom': path.resolve( + // __dirname, + // 'node_modules/react-router-dom', + // ), }, }, server: { diff --git a/packages/bridge/bridge-react-webpack-plugin/src/utis.ts b/packages/bridge/bridge-react-webpack-plugin/src/utis.ts index 00958cf16b6..f0341db07c4 100644 --- a/packages/bridge/bridge-react-webpack-plugin/src/utis.ts +++ b/packages/bridge/bridge-react-webpack-plugin/src/utis.ts @@ -87,18 +87,28 @@ export const getBridgeRouterAlias = ( originalAlias: string, ): Record => { const userDependencies = getDependencies(); - const reactRouterDomPath = originalAlias - ? originalAlias - : userDependencies['react-router-dom'] - ? require.resolve('react-router-dom') - : ''; - const packageJsonPath = reactRouterDomPath - ? findPackageJson(reactRouterDomPath) - : ''; + let reactRouterDomPath = ''; + + if (originalAlias) { + reactRouterDomPath = originalAlias; + } else if (userDependencies['react-router-dom']) { + try { + reactRouterDomPath = path.resolve( + process.cwd(), + 'node_modules/react-router-dom', + ); + } catch (error) { + console.log(error); + } + } + // if find react-router-dom in package.json - if (packageJsonPath) { - const packageJson = JSON.parse(fs.readFileSync(packageJsonPath, 'utf-8')); - const majorVersion = checkVersion(packageJson.version); + if (reactRouterDomPath) { + const packageJsonPath = findPackageJson(reactRouterDomPath) || ''; + const packageJsonContent = JSON.parse( + fs.readFileSync(packageJsonPath, 'utf-8'), + ); + const majorVersion = checkVersion(packageJsonContent.version); const bridgeRouterAlias = setRouterAlias(majorVersion, reactRouterDomPath); console.log( '<<<<<<<<<<<<< bridgeRouterAlias >>>>>>>>>>>>>', diff --git a/packages/bridge/bridge-react/src/router-v5.tsx b/packages/bridge/bridge-react/src/router-v5.tsx index 209ccc1521e..44eacf398d2 100644 --- a/packages/bridge/bridge-react/src/router-v5.tsx +++ b/packages/bridge/bridge-react/src/router-v5.tsx @@ -36,7 +36,7 @@ function WraperRouter( } // @ts-ignore -// cause export directly from react-router-dom/index.js will cause build falied. +// because export directly from react-router-dom/index.js will cause build falied. // it will be replace by react-router-dom/index.js in building phase export * from 'react-router-dom/'; diff --git a/packages/bridge/bridge-react/src/router-v6.tsx b/packages/bridge/bridge-react/src/router-v6.tsx index 44d5630d71b..91f0494d73c 100644 --- a/packages/bridge/bridge-react/src/router-v6.tsx +++ b/packages/bridge/bridge-react/src/router-v6.tsx @@ -69,6 +69,7 @@ function WraperRouterProvider( } } -export * from 'react-router-dom/dist/index.js'; +// export * from 'react-router-dom/dist/index.js'; +export * from 'react-router-dom/'; export { WraperRouter as BrowserRouter }; export { WraperRouterProvider as RouterProvider }; diff --git a/packages/bridge/bridge-react/src/utils.ts b/packages/bridge/bridge-react/src/utils.ts index 080b8f27efc..f7b099bf929 100644 --- a/packages/bridge/bridge-react/src/utils.ts +++ b/packages/bridge/bridge-react/src/utils.ts @@ -1,5 +1,4 @@ import React from 'react'; -import { FederationHost } from '@module-federation/runtime'; import { createLogger } from '@module-federation/sdk'; export const LoggerInstance = createLogger( diff --git a/packages/bridge/bridge-react/vite.config.ts b/packages/bridge/bridge-react/vite.config.ts index 3091faf595c..3379bd90efe 100644 --- a/packages/bridge/bridge-react/vite.config.ts +++ b/packages/bridge/bridge-react/vite.config.ts @@ -1,8 +1,8 @@ import { defineConfig } from 'vite'; -import vue from '@vitejs/plugin-vue'; +// import vue from '@vitejs/plugin-vue'; import path from 'path'; import dts from 'vite-plugin-dts'; -import react from '@vitejs/plugin-react'; +// import react from '@vitejs/plugin-react'; import packageJson from './package.json'; const perDepsKeys = Object.keys(packageJson.peerDependencies); @@ -44,13 +44,13 @@ export default defineConfig({ generateBundle(options, bundle) { for (const fileName in bundle) { const chunk = bundle[fileName]; - // if (fileName.includes('router-v6') && chunk.type === 'chunk') { - // chunk.code = chunk.code.replace( - // // Match 'react-router-dom/' followed by single quotes, double quotes, or backticks, replacing only 'react-router-dom/' to react-router-v6 dist file structure - // /react-router-dom\/(?=[\'\"\`])/g, - // 'react-router-dom/dist/index.js', - // ); - // } + if (fileName.includes('router-v6') && chunk.type === 'chunk') { + chunk.code = chunk.code.replace( + // Match 'react-router-dom/' followed by single quotes, double quotes, or backticks, replacing only 'react-router-dom/' to react-router-v6 dist file structure + /react-router-dom\/(?=[\'\"\`])/g, + 'react-router-dom/dist/index.js', + ); + } if (fileName.includes('router-v5') && chunk.type === 'chunk') { chunk.code = chunk.code.replace(