refactor: guard react router consistency

[xuchaobei]

Summary

The versions of react-router-dom and @remix-run/router must match exactly. @modern-js/plugin-data-loader has a direct dependency on @remix-run/router, while @modern-js/runtime depends on it transitively through react-router-dom. To ensure version consistency, we have moved packages related to react-router to @modern-js/utils. Packages in modernjs now import router-related APIs from @modern-js/utils.

Additionally, due to a change in the DeferredData check logic in react-router (see remix-run/react-router#10247), we can now directly export APIs such as defer from react-router-dom instead of from @remix-run/router.

Details

🤖 Generated by Copilot at 0e09080

• Refactor the router-related code in the @modern-js/utils package and its consumers to use more specific and modular submodules (link,link,link,link,link,link,link,link,link,link,link,link,link,link,link,link,link,link,link,link,link,link,link)
• Create a new submodule @modern-js/utils/runtime/remix-router that contains the types and functions related to the @remix-run/router package, such as UNSAFE_DeferredData, defer, and redirect (link,link,link,link,link)
• Create a new submodule @modern-js/utils/runtime/nested-routes that contains the functions related to the nested routes feature, such as transformNestedRoutes and renderNestedRoute (link,link,link,link)
• Create a new submodule @modern-js/utils/runtime-node/router that re-exports some of the types and functions from react-router-dom/server and adds some custom ones, such as createStaticHandler and StaticHandlerContext (link,link,link,link,link)
• Update the import paths of the types and functions from react-router-dom to use the re-exported versions from @modern-js/utils/runtime/router, which ensures consistency and avoids multiple versions of react-router-dom (link,link,link,link,link,link,link,link,link,link)
• Update the dependencies and peer dependencies of the @modern-js/utils package to remove the @remix-run/router dependency, update the react-router-dom dependency to the exact version 6.11.2, and remove the react-router-dom peer dependency (link)
• Remove the react-router-dom dependency from the @modern-js/runtime package, since it is not directly used by the package, but only re-exported from the @modern-js/utils/runtime/router module (link)
• Add a changeset file that describes the changes made to the packages @modern-js/plugin-data-loader, @modern-js/runtime, and @modern-js/utils, and includes the commit message in both English and Chinese (link)

Related Issue

Checklist

• I have added changeset via pnpm run change.
• I have updated the documentation.
• I have added tests to cover my changes.

[changeset-bot]

🦋 Changeset detected

Latest commit: 1c05a80

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 207 packages

Name	Type
@modern-js/plugin-data-loader	Patch
@modern-js/runtime	Patch
@modern-js/utils	Patch
@modern-js/app-tools	Patch
@modern-js/plugin-bff	Patch
@modern-js/plugin-storybook	Patch
@modern-js/plugin-tailwindcss	Patch
@modern-js/plugin-garfish	Patch
@modern-js/plugin-router-v5	Patch
@modern-js/plugin-testing	Patch
@integration-test/alias-set	Patch
api-service-koa	Patch
app-docmuent	Patch
async-entry-test	Patch
bff-express	Patch
bff-koa	Patch
builder-rspack	Patch
integration-clean-dist-path	Patch
composes-basic	Patch
composes-external	Patch
dev-module	Patch
global-module	Patch
prod-module	Patch
css	Patch
antd-less	Patch
bad-nested-npm-import	Patch
bad-npm-import	Patch
base-import	Patch
disable-source-map	Patch
exclude-less	Patch
exclude-sass	Patch
import-common-css	Patch
less-import	Patch
less-inline-js	Patch
less-npm-import	Patch
multi-css	Patch
multi-less	Patch
multi-sass	Patch
nested-npm-import	Patch
npm-import	Patch
integration-tailwindcss-v2	Patch
integration-tailwindcss-v3	Patch
twin-macro-v2	Patch
twin-macro-v3	Patch
css-modules	Patch
integration-custom-render	Patch
integration-custom-template	Patch
dev-server	Patch
legacy-esbuild-minify-js	Patch
esbuild-transform-and-minify	Patch
@cypress-test/garfish-dashboard-router-v6	Patch
@cypress-test/garfish-dashboard	Patch
@cypress-test/garfish-main-router-v6	Patch
@cypress-test/garfish-main-rspack	Patch
@cypress-test/garfish-main	Patch
@cypress-test/garfish-table	Patch
tmp	Patch
routes	Patch
file-based-router	Patch
use-loader	Patch
select-mul-entry-test	Patch
select-one-entry-test	Patch
server-config	Patch
server-middleware	Patch
server-hook-reqeust	Patch
server-hook-response	Patch
server-hook-router	Patch
@integration-test/server-hook-reqeust	Patch
server-prod	Patch
ssg-fixtures-simple	Patch
ssg-fixtures-web-server	Patch
ssr-base-json-test	Patch
ssr-base-test	Patch
init	Patch
ssr-streaming-test	Patch
swc-minify-css	Patch
swc-minify-js	Patch
transform-fail	Patch
tmp-dir	Patch
worker-test	Patch
@modern-js/babel-preset-app	Patch
@modern-js/babel-preset-base	Patch
@modern-js/babel-preset-lib	Patch
@modern-js/core	Patch
@modern-js/doc-core	Patch
@modern-js/doc-plugin-auto-sidebar	Patch
@modern-js/doc-plugin-medium-zoom	Patch
@modern-js/plugin-changeset	Patch
@modern-js/plugin-i18n	Patch
@modern-js/plugin-lint	Patch
@modern-js/plugin-proxy	Patch
@modern-js/plugin-ssg	Patch
@modern-js/plugin-swc	Patch
@modern-js/generator-common	Patch
@modern-js/generator-plugin	Patch
@modern-js/generator-utils	Patch
@modern-js/new-action	Patch
@modern-js/entry-generator	Patch
@modern-js/repo-generator	Patch
@modern-js/bff-core	Patch
@modern-js/server-core	Patch
@modern-js/create-request	Patch
@modern-js/plugin-express	Patch
@modern-js/plugin-koa	Patch
@modern-js/plugin-polyfill	Patch
@modern-js/plugin-server	Patch
@modern-js/plugin-worker	Patch
@modern-js/prod-server	Patch
@modern-js/server	Patch
@modern-js/server-utils	Patch
@modern-js/builder-rspack-provider	Patch
@modern-js/builder-shared	Patch
@modern-js/builder-webpack-provider	Patch
@modern-js/builder	Patch
@modern-js/builder-plugin-esbuild	Patch
@modern-js/builder-plugin-image-compress	Patch
@modern-js/builder-plugin-node-polyfill	Patch
@modern-js/builder-plugin-stylus	Patch
@modern-js/builder-plugin-swc-base	Patch
@modern-js/builder-plugin-swc	Patch
@modern-js/plugin-module-doc	Patch
@modern-js/doc-tools	Patch
@modern-js/module-tools	Patch
@modern-js/monorepo-tools	Patch
@modern-js/create	Patch
@modern-js/e2e	Patch
@modern-js/node-bundle-require	Patch
@modern-js/plugin	Patch
@modern-js/upgrade	Patch
@modern-js/babel-compiler	Patch
@scripts/vitest-config	Patch
tests	Patch
@e2e/builder-plugin-import	Patch
@e2e/builder	Patch
integration-dev-asset-prefix	Patch
integration-register-builder-plugins	Patch
integration-copy-public-html	Patch
integration-config-async-config-test	Patch
integration-basic-local-config	Patch
integration-config-function-params	Patch
integration-local-config-function	Patch
@modern-js-app/eslint-config	Patch
@modern-js/main-doc	Patch
@modern-js/module-tools-docs	Patch
@modern-js/bff-generator	Patch
@modern-js/dependence-generator	Patch
@modern-js/doc-generator	Patch
@modern-js/generator-generator	Patch
@modern-js/module-generator	Patch
@modern-js/module-test-generator	Patch
@modern-js/monorepo-generator	Patch
@modern-js/mwa-generator	Patch
@modern-js/router-v5-generator	Patch
@modern-js/rspack-generator	Patch
@modern-js/ssg-generator	Patch
@modern-js/storybook-generator	Patch
@modern-js/test-generator	Patch
@modern-js/upgrade-generator	Patch
@modern-js/generator-plugin-plugin	Patch
@modern-js/base-generator	Patch
@modern-js/packages-generator	Patch
@modern-js/server-generator	Patch
@modern-js/tailwindcss-generator	Patch
@scripts/update-codesmith	Patch
@e2e/webpack-builder-image-compress	Patch
@e2e/webpack-builder-css-modules	Patch
@modern-js/builder-doc	Patch
@modern-js/doc-tools-doc	Patch
simple-doc-template	Patch
i18n-doc	Patch
doc-plugin	Patch
simple-doc-production	Patch
@modern-js/plugin-module-babel	Patch
@modern-js/plugin-module-banner	Patch
@modern-js/plugin-module-import	Patch
@modern-js/plugin-module-main-fields	Patch
@modern-js/plugin-module-node-polyfill	Patch
@modern-js/plugin-module-polyfill	Patch
@modern-js/plugin-module-target	Patch
@modern-js/remark-container	Patch
integration-module-doc	Patch
@modern-js/eslint-config	Patch
@modern-js/generator-cases	Patch
@modern-js/changeset-generator	Patch
@modern-js/tsconfig	Patch
@modern-js/bff-runtime	Patch
@modern-js/types	Patch
@scripts/build	Patch
@scripts/check-changeset	Patch
@scripts/codemod	Patch
@scripts/jest-config	Patch
@scripts/lint-package-json	Patch
@scripts/prebundle	Patch
integration-asset-prefix	Patch
integration-builder-plugins	Patch
integration-copy-assets	Patch
doc-tools	Patch
esbuild-integration	Patch
integration-load-config	Patch
runtime	Patch
entry	Patch
ssg	Patch
ssr	Patch
swc-integration	Patch
@e2e/webpack-builder-import-antd-v4	Patch
@e2e/webpack-builder-import-antd-v5	Patch
@e2e/webpack-builder-node-polyfill	Patch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

[codecov]

Codecov Report

Patch coverage has no change and project coverage change: +0.54 🎉

Comparison is base (99693f0) 57.59% compared to head (1c05a80) 58.13%.

Additional details and impacted files

@@            Coverage Diff             @@
##             main    #3724      +/-   ##
==========================================
+ Coverage   57.59%   58.13%   +0.54%     
==========================================
  Files         672      643      -29     
  Lines       17794    17183     -611     
  Branches     3876     3752     -124     
==========================================
- Hits        10249     9990     -259     
+ Misses       6934     6592     -342     
+ Partials      611      601      -10     

see 261 files with indirect coverage changes

☔ View full report in Codecov by Sentry.
📢 Do you have feedback about the report comment? Let us know in this issue.