在启动屏幕后,React Native便崩溃了

时间:2019-06-19 17:49:40

标签: reactjs react-native

Metro Bundler不会给我任何消息,当我单击该应用程序时,它绝对不会执行任何操作,不会告诉我其崩溃的原因。在localhost:8081/debugger-ui上,我得到的就是这个

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

但这根本不是很有帮助,因为我确保8081尚未使用。

这是我的环境:

React Native Environment Info:
    System:
      OS: macOS High Sierra 10.13.6
      CPU: (8) x64 Intel(R) Core(TM) i7-4770HQ CPU @ 2.20GHz
      Memory: 35.21 MB / 16.00 GB
      Shell: 5.3 - /bin/zsh
    Binaries:
      Node: 11.10.1 - /usr/local/bin/node
      Yarn: 1.10.1 - /usr/local/bin/yarn
      npm: 6.7.0 - /usr/local/bin/npm
      Watchman: 4.7.0 - /usr/local/bin/watchman
    SDKs:
      iOS SDK:
        Platforms: iOS 12.1, macOS 10.14, tvOS 12.1, watchOS 5.1
      Android SDK:
        API Levels: 23, 25, 26, 27, 28
        Build Tools: 23.0.1, 26.0.2, 27.0.3, 28.0.3
    IDEs:
      Android Studio: 3.4 AI-183.5429.30.34.5452501
      Xcode: 10.1/10B61 - /usr/bin/xcodebuild
    npmPackages:
      react: 16.8.3 => 16.8.3
      react-native: 0.59.9 => 0.59.9
    npmGlobalPackages:
      react-native-cli: 2.0.1
      react-native-git-upgrade: 0.2.7

那里只有很多噪音,除了绕圈转圈外,什么也没有。

这是我的package.json文件:

"scripts": {
    "start": "nps",
    "test": "nps setup && nps test",
    "build": "nps build",
    "prepare": "nps patcher",
    "setup": "nps setup && nps appcenter",
    "react-devtools": "react-devtools"
  },
  "dependencies": {
    "appcenter": "2.0.0",
    "appcenter-analytics": "2.0.0",
    "appcenter-crashes": "2.0.0",
    "axios": "0.16.2",
    "date-fns": "^1.29.0",
    "lodash": "4.17.4",
    "moment": "2.20.1",
    "payment": "2.3.0",
    "prop-types": "15.6.0",
    "react": "16.8.3",
    "react-native": "0.59.9",
    "react-native-autoheight-webview": "0.6.1",
    "react-native-calendar-events": "1.6.1",
    "react-native-device-info": "0.21.5",
    "react-native-exception-handler": "2.8.9",
    "react-native-image-progress": "1.0.1",
    "react-native-immediate-phone-call": "1.0.0",
    "react-native-keyboard-aware-scroll-view": "0.4.4",
    "react-native-keyboard-manager": "4.0.13-12",
    "react-native-material-buttons": "0.5.0",
    "react-native-material-dropdown": "0.5.2",
    "react-native-material-tabs": "3.5.0",
    "react-native-material-textfield": "0.10.0",
    "react-native-onesignal": "3.0.7",
    "react-native-popup-menu": "0.8.3",
    "react-native-sentry": "0.32.0",
    "react-native-size-matters": "0.1.0",
    "react-native-splash-screen": "3.0.6",
    "react-native-svg": "6.3.1",
    "react-native-swipe-view": "https://github.com/jjd314/react-native-swipe-view",
    "react-native-tab-view": "1.3.2",
    "react-native-vector-icons": "6.1.0",
    "react-native-xcode-packager": "0.1.0",
    "react-navigation": "1.5.11",
    "react-redux": "5.0.6",
    "reactotron-react-native": "3.5.0",
    "reactotron-redux": "3.1.0",
    "recompose": "0.26.0",
    "redux": "4.0.1",
    "redux-thunk": "2.2.0",
    "replace-in-file": "3.1.1"
  },
  "devDependencies": {
    "@babel/core": "7.4.5",
    "@babel/plugin-proposal-optional-chaining": "7.2.0",
    "@babel/runtime": "7.4.5",
    "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-stage-2": "6.24.1",
    "babel-watch": "2.0.6",
    "chalk": "1.1.3",
    "detox": "8.2.3",
    "eslint": "4.12.0",
    "eslint-import-resolver-babel-module": "4.0.0-beta.3",
    "eslint-plugin-import": "2.8.0",
    "eslint-plugin-prettier": "2.3.1",
    "eslint-plugin-react": "7.5.1",
    "flow-bin": "0.46.0",
    "fs-extra": "5.0.0",
    "jest": "23.0.0",
    "metro-react-native-babel-preset": "0.54.1",
    "nps": "5.7.1",
    "nps-utils": "^1.5.0",
    "patch-package": "5.1.1",
    "postinstall-prepare": "1.0.1",
    "prettier": "1.8.2",
    "prettier-eslint": "8.2.2",
    "react-devtools": "3.6.1",
    "react-test-renderer": "16.2.0",
    "redux-mock-store": "1.3.0",
    "yargs": "8.0.1"
  },
  "jest": {
    "preset": "react-native",
    "setupTestFrameworkScriptFile": "./jest-setup.js",
    "transformIgnorePatterns": [
      "/node_modules/(?!parse)/"
    ],
    "unmockedModulePathPatterns": [
      "react",
      "react-navigation",
      "axios",
      "redux",
      "redux-thunk",
      "lodash",
      "date-fns"
    ],
    "verbose": true
  },
  "detox": {
    "configurations": {
      "ios.sim.debug": {
        "binaryPath": "ios/build/Build/Products/Debug-iphonesimulator/NFIBEngage.app",
        "build": "xcodebuild -workspace ios/NFIBEngage.xcworkspace -configuration Debug -scheme NFIBEngage -sdk iphonesimulator -derivedDataPath ios/build",
        "type": "ios.simulator",
        "name": "iPhone 6"
      }
    },
    "test-runner": "jest"
  }
}

那么依赖项是否有问题?到底是怎么回事?上次我从React Native团队的任何人那里收到消息时,都被告知我需要将RN项目从0.53.3升级到0.59.9,现在已经完成了,现在我得到的应用程序崩溃了。

react-native log-ios除了告诉我5秒内重生的信息外,什么也没告诉我。我的智慧到此为止。如果我知道为什么我的应用程序崩溃了,而我尝试安装bugsnag却发现它有自己的问题,那我就太好了,所以我不想继续下去。

至少可以知道为什么应用程序在启动屏幕上崩溃而没有安装另一个用于监视的软件包的肯定方式吗?

我不一定认为这是一个版本问题,因为当我回到RN版本0.53.3时,启动屏幕也会崩溃。

我没有完全探讨的一个“解决方案”是运行grep -R "View.proptypes.style" node_modules

我确实运行了该命令,但是如果问题出在节点模块内部,那么对我来说,最佳实践是在节点模块内部调整代码吗?

崩溃的0.53.3版本也不会返回任何结果,但是0.59.9版本确实会返回一堆文件。我只是不这么认为。导致0.53.3版本崩溃的原因必须是最终导致0.59.9版本崩溃的原因,但是在升级之前和升级过程中,应用程序并未崩溃。

实际上,即使我进入分支又几周没有尝试并尝试从那里启动应用程序,它也会崩溃,所以这是模拟器的Xcode问题吗?

1 个答案:

答案 0 :(得分:0)

我能够通过以下方式访问MacOS日志:聚光灯并输入console,清除控制台,然后在尝试在模拟器中打开应用程序时对其进行观察。

与大多数日志一样,需要检查的内容很多,但是错误消息是一个很好的起点:

Terminating app due to uncaught exception 'RCTFatalException: Unhandled JS Exception: Cannot create styled-component for component: [object Object]', reason: 'Unhandled JS Exception: Cannot create styled-component for component: [object Object]