infinitered / reactotron

A desktop app for inspecting your React JS and React Native projects. macOS, Linux, and Windows.
https://docs.infinite.red/reactotron/
MIT License
14.85k stars 945 forks source link

Application won't connect to Reactotron (iOS Simulator) #1185

Open FR073N opened 4 years ago

FR073N commented 4 years ago

When running my application in the iOS Mac Simulator, it won't connect to Reactotron even if I should have the good configuration.

My configuration used to work before, but after some changes it doesn't anymore. I checked with the demo app and it's correctly connecting.

Package.json

{
"scripts": {
    "android": "react-native run-android",
    "ios": "react-native run-ios",
    "ios8": "react-native run-ios --simulator=\"iPhone 8\"",
    "start": "react-native start",
    "lint": "eslint .",
    "lint:fix": "yarn lint --fix",
    "storybook": "start-storybook -p 7007",
    "test": "TZ=UTC jest --watch",
    "test:ci": "TZ=UTC jest --coverage --maxWorkers=2",
    "generate:icon": "react-native set-icon --path assets/logo/logo.jpg --platform all",
    "generate:splash": "react-native set-splash --path assets/splash/splash.png --resize cover --background #f55b3a"
  },
  "husky": {
    "hooks": {
      "pre-push": "yarn lint"
    }
  },
  "dependencies": {
    "@mindinventory/react-native-tab-bar-interaction": "mindinventory/react-native-tab-bar-interaction",
    "@react-native-community/async-storage": "^1.8.1",
    "@react-native-community/masked-view": "^0.1.7",
    "@react-navigation/bottom-tabs": "^5.2.1",
    "@react-navigation/native": "^5.0.9",
    "@react-navigation/stack": "^5.1.1",
    "axios": "^0.19.2",
    "i18n": "^0.8.5",
    "i18n-js": "^3.5.1",
    "immutable": "^4.0.0-rc.12",
    "native-base": "^2.13.12",
    "react": "^16.13.0",
    "react-native": "0.61.5",
    "react-native-gesture-handler": "^1.6.0",
    "react-native-global-props": "^1.1.5",
    "react-native-linear-gradient": "^2.5.6",
    "react-native-localize": "^1.3.4",
    "react-native-paper": "^3.6.0",
    "react-native-screens": "^2.3.0",
    "react-native-snap-carousel": "^3.8.4",
    "react-native-splash-screen": "^3.2.0",
    "react-native-svg": "^12.0.3",
    "react-native-swiper": "^1.6.0-nightly.5",
    "react-native-vector-icons": "^6.6.0",
    "react-navigation": "^4.2.2",
    "react-navigation-material-bottom-tabs": "^2.2.4",
    "react-navigation-tabs": "^2.8.2",
    "react-redux": "^7.2.0",
    "redux": "^4.0.5",
    "redux-logger": "^3.0.6",
    "redux-persist": "^6.0.0",
    "redux-persist-transform-expire": "^0.0.2",
    "redux-persist-transform-immutable": "^5.0.0",
    "redux-saga": "^1.1.3",
    "reselect": "^4.0.0"
  },
  "devDependencies": {
    "@babel/core": "^7.6.2",
    "@babel/runtime": "^7.6.2",
    "@bam.tech/react-native-make": "^2.0.0",
    "@react-native-community/eslint-config": "^0.0.5",
    "@storybook/addon-actions": "^5.3.17",
    "@storybook/addon-links": "^5.3.17",
    "@storybook/addons": "^5.3.17",
    "@storybook/react-native": "^5.3.17",
    "@storybook/react-native-server": "^5.3.17",
    "@testing-library/react-native": "^5.0.3",
    "babel-jest": "^24.9.0",
    "babel-loader": "^8.1.0",
    "babel-plugin-module-resolver": "^4.0.0",
    "eslint": "^6.5.1",
    "eslint-config-airbnb": "^18.0.1",
    "eslint-config-prettier": "^6.4.0",
    "eslint-config-standard": "^14.1.0",
    "eslint-config-standard-react": "^9.2.0",
    "eslint-import-resolver-babel-module": "^5.1.2",
    "eslint-plugin-import": "^2.18.2",
    "eslint-plugin-jest": "^22.17.0",
    "eslint-plugin-jsx-a11y": "^6.2.3",
    "eslint-plugin-node": "^10.0.0",
    "eslint-plugin-prettier": "^3.1.1",
    "eslint-plugin-promise": "^4.2.1",
    "eslint-plugin-react": "^7.16.0",
    "eslint-plugin-react-hooks": "^2.1.2",
    "eslint-plugin-redux-saga": "1.0.0",
    "eslint-plugin-standard": "^4.0.1",
    "husky": "^4.2.3",
    "jest": "^24.9.0",
    "metro-react-native-babel-preset": "^0.56.0",
    "prettier": "^1.18.2",
    "react-dom": "^16.13.0",
    "react-test-renderer": "^16.13.1",
    "reactotron-react-native": "^4.0.3",
    "reactotron-redux": "^3.1.2",
    "reactotron-redux-saga": "^4.2.3"
  },
  "jest": {
    "preset": "react-native",
    "transform": {
      "node_modules/react-native/.+\\.js$": "<rootDir>/node_modules/react-native/jest/preprocessor.js"
    }
  }

Here are my app configs :

reactotron.js :

/* eslint-disable no-console */
/* global __DEV__ */

import Reactotron from 'reactotron-react-native';
import AsyncStorage from '@react-native-community/async-storage';
import { reactotronRedux } from 'reactotron-redux';
import sagaPlugin from 'reactotron-redux-saga';

const reactotron = Reactotron.setAsyncStorageHandler(AsyncStorage);

// connecting the app
reactotron.configure();

// plugins
reactotron.useReactNative({
  storybook: true,
});
reactotron.use(
  reactotronRedux({
    isActionImportant: action => action.type.startsWith('core/'),
  }),
);
reactotron.use(sagaPlugin());

if (__DEV__) {
  Reactotron.connect();
  Reactotron.clear();
}

if (__DEV__) {
  console.tron = Reactotron.logImportant;
} else {
  console.tron = console.error;
}

export default reactotron;

I checked with reactotron react-native demo app to compare if it's a port / hostname error, and I have exactly the same outputs when checking my ports :

My app :

Capture d’écran 2020-04-04 à 09 54 54 Capture d’écran 2020-04-04 à 09 56 40

The demo app which is correctly connecting to reactotron :

Capture d’écran 2020-04-04 à 09 56 47 Capture d’écran 2020-04-04 à 09 56 50
developerantoniosousa commented 4 years ago

Try adding host in configure method. Here localhost work well, but sometimes I need putting my Mac's IP address

reactotron.configure({ host: 'localhost' });

or

const host = <IP_ADDRESS>
reactotron.configure({ host });