React native React本机克隆的repo有Reactotron代码,现在我想使用它,但没有连接

React native React本机克隆的repo有Reactotron代码,现在我想使用它,但没有连接,react-native,reactotron,React Native,Reactotron,所以我从Github克隆了一个React原生应用程序,并注意到这个名为Reactotron的包,我想知道的是什么?我查了一下,嗯,不错,就像Redux开发工具一样,为什么不利用它的功能呢 我下载了Mac的ReactiotronUI,并且我已经刷新了我的模拟器多次,没有连接 这是我第一次学习这个听起来很棒的工具 这是我在代码库中看到的Reactotron设置,正如InfiniteRed的同事所建议的: import Reactotron, { trackGlobalErrors, open

所以我从Github克隆了一个React原生应用程序,并注意到这个名为Reactotron的包,我想知道的是什么?我查了一下,嗯,不错,就像Redux开发工具一样,为什么不利用它的功能呢

我下载了Mac的ReactiotronUI,并且我已经刷新了我的模拟器多次,没有连接

这是我第一次学习这个听起来很棒的工具

这是我在代码库中看到的Reactotron设置,正如InfiniteRed的同事所建议的:

import Reactotron, {
  trackGlobalErrors,
  openInEditor,
  networking,
} from 'reactotron-react-native';
import {reactotronRedux} from 'reactotron-redux';

Reactotron.configure({
  name: 'AppName - Mobile',
})
  .useReactNative()
  .use(reactotronRedux())
  .use(trackGlobalErrors())
  .use(openInEditor())
  .use(networking());

//eslint-disable-next-line
if (__DEV__) {
  Reactotron.connect();
  Reactotron.clear();
  //eslint-disable-next-line
  debug = (title, data={}) =>
    Reactotron.display({
      name: title,
      value: data,
      preview: JSON.stringify(data).substr(0, 50),
    });
}
这段代码中缺少什么可以解释我缺乏连接的原因吗

package.json
文件中没有提供用于建立连接的脚本:

{
  "name": "AppName",
  "version": "3.0",
  "private": true,
  "scripts": {
    "start": "nps",
    "test": "nps setup",
    "build": "nps build",
    "setup": "nps setup && nps appcenter",
    "postinstall": "rm -f ./node_modules/react-native/local-cli/core/__fixtures__/files/package.json"
  },
  "dependencies": {
    "appcenter": "1.2.0",
    "appcenter-analytics": "1.2.0",
    "appcenter-crashes": "1.2.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.2.0",
    "react-native": "0.53.3",
    "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-input-scroll-view": "1.6.7",
    "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.2.12",
    "react-native-popup-menu": "0.8.3",
    "react-native-sentry": "0.32.0",
    "react-native-size-matters": "0.1.0",
    "react-native-spinkit": "1.1.1",
    "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-vector-icons": "^6.4.2",
    "react-native-xcode-packager": "0.1.0",
    "react-navigation": "1.5.11",
    "react-redux": "5.0.6",
    "recompose": "0.26.0",
    "redux": "3.7.2",
    "redux-thunk": "2.2.0",
    "replace-in-file": "3.1.1"
  },
  "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",
    "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.6.0",
    "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-test-renderer": "16.2.0",
    "reactotron-react-native": "1.14.0",
    "reactotron-redux": "1.13.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"
  }
}
Reactotron配置文件已导入
App.js
文件,如下所示:

//eslint-disable-next-line
console.ignoredYellowBox = ["Setting a timer"];
import './ReactotronConfig';
import React, {PureComponent} from 'react';
import {
  StyleSheet,
  View,
  StatusBar,
  Linking,
  Platform,
  Alert,
} from 'react-native';
import {applyMiddleware, compose, combineReducers} from 'redux';
import {Provider} from 'react-redux';
import thunkMiddleware from 'redux-thunk';
import Reactotron from 'reactotron-react-native';
import logger from 'logger';
import OneSignal from 'react-native-onesignal';
import SplashScreen from 'react-native-splash-screen';
import {Sentry} from 'react-native-sentry';
import {
  setJSExceptionHandler,
  setNativeExceptionHandler,
} from 'react-native-exception-handler';
import {jsHandler, nativeHandler} from 'utils/error-handlers';

import RootNavigation from 'navigation/RootNavigation';
import LocalStorage from 'services/LocalStorage';
import reducers from 'reducers';
import {
  setCurrentUser,
  validateUserInformationForVoterVoice,
} from 'auth/loginActions';
import {handleEventsDeepLink} from 'events/actions';
import {handleBallotsDeepLink} from 'surveys-ballots/actions';
import {setResetPasswordKey} from 'auth/registrationActions';
import {setNotificationData, deepLinkReceived} from 'navigation/actions';
import {view} from 'utils/view';
import {v2Colors} from 'theme';
import env from 'env';
import base from 'base-endpoint';
import * as appcenter from 'utils/appcenterLogger';
import * as cache from 'utils/cache';
import * as regex from 'utils/helpers/regex';

const appReducer = combineReducers({
  ...reducers,
});
const middleware = applyMiddleware(thunkMiddleware);
//react-native-debugger config
// eslint-disable-next-line no-underscore-dangle
const composeEnhancers = window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ || compose;
const store = Reactotron.createStore(appReducer, composeEnhancers(middleware));

您需要在以下位置导入reactotron配置文件: -App.js(如果您的项目是使用Create React Native App创建的)或 -第1行的index.js:

导入“pathtofile/reactoronconfig.js”

您还可以查看此链接以获取开始指南。

我从头开始创建了一个项目,它确实对我有效。问题似乎在于这两个软件包的版本,请尝试从以下位置更新它们:

“reactotron react native”:“1.14.0”

“reactotron redux”:“1.13.0”

致:

“reactotron react native”:“^3.5.0”

“reactotron redux”:“^3.1.0”


Carlos,这部分完成了,我将在OP中向你展示。你使用的是android还是ios模拟器?我使用的是ios模拟器。你好,Daniel,我从头开始做了一个新项目,它工作得很好,然后我切换到你的依赖项版本,它停止连接,“reactotron react native”:“1.14.0”,“reactotron redux”:“1.13.0”,尝试切换到“reactotron react native”:“^3.5.0”,“reactotron redux”:“^3.1.0”,希望这能起作用。感谢您的帮助,但与大多数react native一样,无论何时更新软件包,它都会破坏更改,因为现在我要么必须重构代码,要么返回到以前的软件包,很烦人,因为更新这些软件包破坏了我的应用程序。好消息是,它现在连接到Reactotron。因此,即使它破坏了我的应用程序,以使其工作,请张贴您的建议作为答案。