我正在开发一个新的 React Native Expo 应用程序，最近我注意到，当打开抽屉或模式时，我的终端中出现以下错误：
λ Bundling failed 71ms node_modules/expo-router/node/render.js (1 module)
Metro error: Unable to resolve module react-dom/server.node from /Users/<me>/Documents/repositories/<project>/node_modules/expo-router/build/static/renderStaticContent.js: react-dom/server.node could not be found within the project or in these directories:
node_modules/expo-router/node_modules
node_modules
38 | const Font = __importStar(require("expo-font/build/server"));
39 | const react_1 = __importDefault(require("react"));
> 40 | const server_node_1 = __importDefault(require("react-dom/server.node"));
| ^
41 | const react_native_web_1 = require("react-native-web");
42 | const getRootComponent_1 = require("./getRootComponent");
43 | const _ctx_1 = require("../../_ctx");
Call Stack
<unknown> (node_modules/expo-router/build/static/renderStaticContent.js:0)
Web Bundling failed 3819ms node_modules/expo-router/entry.js (2427 modules)
我的package.json如下：
{
"name": "test_mobile",
"version": "1.0.0",
"main": "expo-router/entry",
"scripts": {
"start": "npx expo start",
"android": "npx expo run:android",
"ios": "npx expo run:ios",
"web": "npx expo start --web",
"lint": "eslint .",
"postinstall": "patch-package",
"typegen": "npx supabase gen types typescript --local public > ./types/index.ts && tsx scripts/generateEnums.ts",
},
"dependencies": {
"@cloudinary/url-gen": "^1.20.0",
"@dev-plugins/react-query": "^0.0.7",
"@expo/html-elements": "0.4.2",
"@gorhom/bottom-sheet": "5.0.0-alpha.10",
"@hookform/resolvers": "^3.9.0",
"@legendapp/motion": "^2.4.0",
"@react-native-async-storage/async-storage": "1.23.1",
"@react-native-google-signin/google-signin": "^13.0.0",
"@react-navigation/drawer": "^6.7.2",
"@stripe/stripe-react-native": "0.37.2",
"@supabase/supabase-js": "^2.45.2",
"@tanstack/react-query": "^5.55.4",
"axios": "^1.7.7",
"babel-plugin-module-resolver": "^5.0.2",
"dayjs": "^1.11.13",
"expo": "^51.0.31",
"expo-apple-authentication": "~6.4.2",
"expo-build-properties": "~0.12.5",
"expo-constants": "~16.0.2",
"expo-dev-client": "~4.0.26",
"expo-image": "~1.12.15",
"expo-linking": "~6.3.1",
"expo-router": "~3.5.23",
"expo-secure-store": "~13.0.2",
"expo-splash-screen": "~0.27.5",
"expo-status-bar": "~1.12.1",
"expo-system-ui": "~3.0.7",
"jwt-decode": "^4.0.0",
"lucide-react-native": "^0.436.0",
"react": "18.2.0",
"react-hook-form": "^7.53.0",
"react-native": "0.74.5",
"react-native-click-outside": "^0.1.1",
"react-native-fbsdk-next": "^13.0.0",
"react-native-gesture-handler": "~2.16.1",
"react-native-paper": "^5.12.5",
"react-native-reanimated": "~3.10.1",
"react-native-safe-area-context": "4.10.5",
"react-native-screens": "3.31.1",
"react-native-svg": "15.2.0",
"react-native-url-polyfill": "^2.0.0",
"sonner-native": "^0.8.0",
"stripe": "^16.10.0",
"supabase": "^1.192.5",
"zod": "^3.23.8",
"zustand": "^4.5.5"
},
"devDependencies": {
"@babel/core": "^7.20.0",
"@dev-plugins/react-navigation": "^0.0.6",
"@stylistic/eslint-plugin": "^2.6.4",
"@tanstack/eslint-plugin-query": "^5.53.0",
"@types/react": "~18.2.45",
"babel-plugin-optional-require": "^0.3.1",
"babel-plugin-transform-remove-console": "^6.9.4",
"eslint": "^8.57.0",
"eslint-config-expo": "^7.1.2",
"jscodeshift": "0.15.2",
"patch-package": "^8.0.0",
"prettier": "^3.3.3",
"react-native-svg-transformer": "^1.5.0",
"tsx": "^4.19.0",
"typescript": "~5.3.3"
},
"private": true
}
还有我的 app.json：
{
"expo": {
"name": "test_mobile",
"slug": "test-mobile",
"scheme": "test-mobile",
"version": "1.0.0",
"orientation": "portrait",
"icon": "./assets/icon.png",
"userInterfaceStyle": "automatic",
"splash": {
"image": "./assets/splash.png",
"resizeMode": "contain",
"backgroundColor": "#ffffff"
},
"platforms": ["ios", "android"],
"assetBundlePatterns": [
"**/*"
],
"ios": {
"associatedDomains": [
"applinks:test.com"
],
"userInterfaceStyle": "automatic",
"supportsTablet": true,
"bundleIdentifier": "com.Test.mobile",
"infoPlist": {
"SKAdNetworkItems": [
{
"SKAdNetworkIdentifier": "xxxxx.skadnetwork"
},
{
"SKAdNetworkIdentifier": "xxxxx.skadnetwork"
}
]
}
},
"android": {
"adaptiveIcon": {
"foregroundImage": "./assets/adaptive-icon.png",
"backgroundColor": "#ffffff"
},
"userInterfaceStyle": "automatic",
"intentFilters": [
{
"action": "VIEW",
"autoVerify": true,
"data": [
{
"scheme": "https",
"host": "*.test.com",
"pathPrefix": "/"
}
],
"category": ["BROWSABLE", "DEFAULT"]
}
],
"package": "com.anonymous.test_mobile",
"permissions": [
"android.permission.INTERNET"
]
},
"web": {
"favicon": "./assets/favicon.png",
"output": "server"
},
"plugins": [
[
"@react-native-google-signin/google-signin",
{
"iosUrlScheme": "xxxxx"
}
],
[
"react-native-fbsdk-next",
{
"appID": "",
"clientToken": "",
"displayName": "Test",
"isAutoInitEnabled": true
}
],
[
"expo-build-properties",
{
"ios": {
"flipper": false
}
}
],
[
"expo-router",
{
"origin": ""
}
],
"expo-apple-authentication",
"expo-secure-store"
],
"experiments": {
"typedRoutes": true
},
"extra": {
"router": {
"origin": false
},
"eas": {
"projectId": "xxxxx"
}
},
"owner": "me"
}
}
这只是一个 iOS/Android 应用程序，所以我不一定关心网络捆绑。我确实在 app.json 中有一些 Web 属性（我认为有必要能够使用 Stripe 的 Expo 服务器 API 等？），所以我的感觉是它来自那里。该错误没有给我太多信息。我该如何修复这个错误？
您可能需要使用以下命令安装
react-domnpm 我反应-dom