ios - 节点类型 SpreadProperty 已重命名为 SpreadElement

Question

我最近从 React Native 0.53.3 升级到 React Native 0.59.9，我的应用程序在模拟器内不断崩溃。它将显示启动屏幕，然后崩溃，除了以下内容之外，debugger-ui 中没有任何内容:

WebSocket connection to'ws://localhost:8081/debugger-proxy?role=debugger&name=Chrome' failed:Error in connection establishment: net::ERR_CONNECTION_REFUSED

我使用 react-native run-ios 运行它，但构建成功，因此没有错误消息。当我尝试在打开 Xcode 的情况下打开应用程序时，它确实提到了无法找到 .jsbundle 文件的错误，并且在 Xcode 内部，我确实有一个 main.jsbundle 为红色，表示缺少。

找到这篇文章后: https://medium.com/the-react-native-log/first-time-deploying-with-react-native-f524eb3e705d#59ee

我尝试使用引用此脚本的 npm run build:ios 脚本来跟踪它:

"build:ios": "react-native bundle --entry-file='index.ios.js' --bundle-output='./ios/NFIBEngage/main.jsbundle' --dev=false --platform='ios' --assets-dest='./ios'"

但是当我运行它时，我收到此错误:

Loading dependency graph, done.
transform[stderr]: Trace: The node type SpreadProperty has been renamed to SpreadElement
transform[stderr]:     at Object.isSpreadProperty (/Users/danale/Projects/engage-application.mobile/node_modules/@babel/types/lib/validators/generated/index.js:4304:11)
transform[stderr]:     at hasSpread (/Users/danale/Projects/engage-application.mobile/node_modules/babel-plugin-transform-object-rest-spread/lib/index.js:38:13)
transform[stderr]:     at PluginPass.ObjectExpression (/Users/danale/Projects/engage-application.mobile/node_modules/babel-plugin-transform-object-rest-spread/lib/index.js:234:14)
transform[stderr]:     at newFn (/Users/danale/Projects/engage-application.mobile/node_modules/@babel/traverse/lib/visitors.js:193:21)
transform[stderr]:     at NodePath._call (/Users/danale/Projects/engage-application.mobile/node_modules/@babel/traverse/lib/path/context.js:53:20)
transform[stderr]:     at NodePath.call (/Users/danale/Projects/engage-application.mobile/node_modules/@babel/traverse/lib/path/context.js:40:17)
transform[stderr]:     at NodePath.visit (/Users/danale/Projects/engage-application.mobile/node_modules/@babel/traverse/lib/path/context.js:88:12)
transform[stderr]:     at TraversalContext.visitQueue (/Users/danale/Projects/engage-application.mobile/node_modules/@babel/traverse/lib/context.js:118:16)
transform[stderr]:     at TraversalContext.visitSingle (/Users/danale/Projects/engage-application.mobile/node_modules/@babel/traverse/lib/context.js:90:19)
transform[stderr]:     at TraversalContext.visit (/Users/danale/Projects/engage-application.mobile/node_modules/@babel/traverse/lib/context.js:146:19)
error node_modules/react-native-keyboard-manager/index.js: Cannot read property 'bindings' of null. Run CLI with --verbose flag for more details.

SO 上与该错误相关的唯一帖子如下:

https://stackoverflow.com/questions/53326986/trace-the-node-type-spreadproperty-has-been-renamed-to-spreadelement-at-object

它并不真正适用于我的情况。

问题似乎出在 node_modules 内的 @babel 库，我尝试过执行 rm -rf node_modules，但是那没有解决。

此项目的当前版本是否不再支持这些开发依赖项之一？

"devDependencies": {
    "async": "2.6.0",
    "babel-cli": "6.24.1",
    "babel-eslint": "8.0.2",
    "babel-jest": "23.0.0",
    "babel-plugin-module-resolver": "3.0.0",
    "babel-preset-env": "1.4.0",
    "babel-preset-flow": "6.23.0",
    "babel-preset-react-native": "4.0.0",
    "babel-preset-stage-2": "6.24.1",
    "babel-watch": "2.0.6",

如何解决此问题(升级到 React Native 0.59.9)？

我了解到，在 RN 0.49 之后，我们使用 index.js 而不是 index.ios.js，并且当我创建一个模拟版本来尝试时，我验证了这一点获取一个基线应用程序来尝试弄清楚发生了什么。

我做了以下事情:

✗ mv index.ios.js index.js
➜  engage-application.mobile git:(feature/3.6.2_upgrade) ✗ rm index.android.js
➜  engage-application.mobile git:(feature/3.6.2_upgrade) ✗ react-native bundle --entry-file ./index.js --platform ios --bundle-output ios/main.jsbundle --verbose
Loading dependency graph, done.
transform[stderr]: Trace: The node type SpreadProperty has been renamed to SpreadElement
transform[stderr]:     at Object.isSpreadProperty (/Users/danale/Projects/engage-application.mobile/node_modules/@babel/types/lib/validators/generated/index.js:4304:11)
transform[stderr]:     at hasSpread (/Users/danale/Projects/engage-application.mobile/node_modules/babel-plugin-transform-object-rest-spread/lib/index.js:38:13)
transform[stderr]:     at PluginPass.ObjectExpression (/Users/danale/Projects/engage-application.mobile/node_modules/babel-plugin-transform-object-rest-spread/lib/index.js:234:14)
transform[stderr]:     at newFn (/Users/danale/Projects/engage-application.mobile/node_modules/@babel/traverse/lib/visitors.js:193:21)
transform[stderr]:     at NodePath._call (/Users/danale/Projects/engage-application.mobile/node_modules/@babel/traverse/lib/path/context.js:53:20)
transform[stderr]:     at NodePath.call (/Users/danale/Projects/engage-application.mobile/node_modules/@babel/traverse/lib/path/context.js:40:17)
transform[stderr]:     at NodePath.visit (/Users/danale/Projects/engage-application.mobile/node_modules/@babel/traverse/lib/path/context.js:88:12)
transform[stderr]:     at TraversalContext.visitQueue (/Users/danale/Projects/engage-application.mobile/node_modules/@babel/traverse/lib/context.js:118:16)
transform[stderr]:     at TraversalContext.visitSingle (/Users/danale/Projects/engage-application.mobile/node_modules/@babel/traverse/lib/context.js:90:19)
transform[stderr]:     at TraversalContext.visit (/Users/danale/Projects/engage-application.mobile/node_modules/@babel/traverse/lib/context.js:146:19)
error App.js: Cannot read property 'bindings' of null
debug TypeError: Cannot read property 'bindings' of null
    at Scope.moveBindingTo (/Users/danale/Projects/engage-application.mobile/node_modules/@babel/traverse/lib/scope/index.js:864:13)
    at BlockScoping.updateScopeInfo (/Users/danale/Projects/engage-application.mobile/node_modules/babel-plugin-transform-es2015-block-scoping/lib/index.js:364:17)

无论如何，我仍然遇到相同的错误。

Answer 1

这里实际上发生了两个不同的问题。

WebSocket connection to 'ws://localhost:8081/debugger-proxy?role=debugger&name=Chrome' failed: Error in connection establishment: net::ERR_CONNECTION_REFUSED

错误与端口 8081 已在使用中有关，因此我必须完全终止所有进程。

Babel 和一两个自定义包之间肯定存在一些依赖性问题，这是主要的 react-native-keyboard-manager和 react-native-input-scroll-view 。我删除了这些并使用了 react-native的ScrollView相反。

然后我就能够成功运行:

react-native bundle --entry-file ./index.js --platform ios --bundle-output ios/main.jsbundle --verbose

这样就能够成功创建 main.jsbundle ，但不幸的是，这并不是应用程序崩溃的根本原因，因为它现在仍在崩溃并且悄无声息地崩溃。