ERROR TypeError: Restricted in strict mode, js engine: hermes is getting thrown when trying to import Axios for network request in react native application. The error gets removed when i'm trying to remove the import statement from the below code.
api.js
import axios from "axios";
export default axios.create({
baseURL:"https://.com/v3/test",
headers:{
Authorization:'Bearer fsdfsfsd'
}
});
Try to downgrade the axios version.
yarn remove axios
yarn add axios#0.27.2
If it is not getting listed from node modules when trying to import Axios, import the package as follows:
const axios = require('axios')
I'm trying to load the default stories that come when you first install Storybook. Had some issues getting the server to start but I managed to fix it by adding port and host in the config. But even after getting it to run, clicking on any of the components doesn't update.
I'm expecting to see a Button.
And ideas? Here's the storybook index.js. I'm using Expo.
// if you use expo remove this line
// import { AppRegistry } from "react-native";
import {
getStorybookUI,
configure,
addDecorator,
} from "#storybook/react-native";
// import { withKnobs } from '#storybook/addon-knobs';
import "./rn-addons";
// enables knobs for all stories
// addDecorator(withKnobs);
// import stories
configure(() => {
require("./stories");
}, module);
const StorybookUIRoot = getStorybookUI({
host: "192.168.100.6", // replace this ip address with your local ip address
port: "7007",
asyncStorage: null,
});
// If you are using React Native vanilla and after installation you don't see your app name here, write it manually.
// If you use Expo you should remove this line.
// AppRegistry.registerComponent("%APP_NAME%", () => StorybookUIRoot);
export default StorybookUIRoot;
Also not sure if this is related but I've had to comment out addon-knobs in addons.js because it can't find it even though I have addon-knobs in my package.json:
import '#storybook/addon-actions/manager';
import '#storybook/addon-links/manager';
// import '#storybook/addon-knobs/manager';
I've tried replacing it with
register
like I've read on here but it still didn't work.
import '#storybook/addon-knobs/register';
i have a react native app that i'm trying to have a chat functionality with , which worked just great and just as i expected until i was ready to post for production . the whole code works perfectly with expo start and development mode but when i run the app with production mode sockets do not work at all. or they work partially.
i have two apps and in one it recieves but don't send messages and the other one doesn't do anything at all(one is android and the other is ios).
i'm connecting to my socket io using the following:
in App.js...
import { SocketContext , socket } from "./context/socket";
return (
<SocketContext.Provider value={socket}>
<SafeAreaProvider>
<Navigation colorScheme={colorScheme} />
<StatusBar />
<Toast ref={(ref) => Toast.setRef(ref)} />
</SafeAreaProvider>
</SocketContext.Provider>
);
in my socket.js file i have:
import OpenSocket from "socket.io-client";
import { API_URL } from "../constants/API";
import React from 'react';
import useRoom from "../tools/useRoom";
import useSession from "../tools/useSession" ;
import useUser from "../tools/useUser" ;
// import AsyncStorage from "#react-native-async-storage/async-storage";
// import { AsyncStorage } from "react-native";
export const userIDStorage = 'user-id'
// const {userID , sessionID } = await getUserID();
export const socket = OpenSocket.connect(API_URL);
socket.on('connect',()=>{
console.log('user connected...');
// TODO ==> check if there is a local room saved and if it is active...
});
export const SocketContext = React.createContext();
and in my chat page i have the following to call and emit from the socket ::
import { SocketContext } from "../../context/socket";
const socket = useContext(SocketContext);
in the rest of the page i just call
socket.emit('something',{data});
as such...
anyways there is no output to actually get in expo production mode apps but i was able to deduce that when the app is in production mode sockets aren't firing by testing every line of the code alone on different events... and when i'm in development mode everything works as it should.
Note :
for the server side i'm using a heroku hosted express but i didn't add anything about it here cuz i tested the apps on development mode with the production server and they work fine it's just when they are in producion mode they don't work anymore.
I try to debug an application with Reactotron in a (IOS) React Native project but there is "No Activity" when I run my application.
I work with react-native 0.55.4, reactotron 2.1.0 (same in my package.json)
TimeLine Reactotron
My reactotronConfig.js
index.js file where reactotron is imported
reactotron in my package.json
You have to do the following:
enter on CLI: adb reverse tcp:9090 tcp:9090
add this to a file (e.g lib/Reactotron.js):
import Reactotron, { asyncStorage } from 'reactotron-react-native';
Reactotron
.configure() // controls connection & communication settings
.useReactNative(asyncStorage()) // add all built-in react native plugins
.connect();
import the File in your app.js:
if (__DEV__) {
import('../../lib/Reactotron').then(() => console.log('Reactotron Configured'));
}
Note: If you wan't to use host Prorperty inside of configure(), be sure to use 127.0.0.1. In my case other IP (even if local like 192.x.x.x) doesn't work.
After that, you connection should work, and you can use Reactotron like described in the Docs.
HINT:
For Linux & Mac, you can add this to package.json (script-section) (adjust the path & call of your reactotron-app to your needs):
"scripts": {
...
"reactotron": "adb reverse tcp:9090 tcp:9090 && /opt/Reactotron/reactotron-app",
...
}
I did this adb reverse tcp:9090 tcp:9090 that I got from Suther and yarn start --reset-cache and it worked.
First of, you are not assigning the configured Reactotron object to your console.tron value. You need to do something like this:
console.tron = Reactotron.configure({ ...
Looking at your reactotronConfig.js file I notice that you are sending it to localhost. This will only work when running on the simulator (not sure if that is what you are doing).
If you want to run it on a device, you will need to give it your packager's ip address. A neat way of doing that is to use the following code:
import { NativeModules } from 'react-native';
let packagerHostname = "localhost";
if (__DEV__) {
const scriptURL = NativeModules.SourceCode.scriptURL;
packagerHostname = scriptURL.split("://")[1].split(":")[0];
}
const reactotron = Reactotron.configure({
name: "myAPPILOC",
host: packagerHostname
});
console.tron = Reactotron;
Please enable debug mode ( Press ⌘+D on iOS simulator, ⌘+M on Android emulator, or shake real devices). Then kill app and restart app.
I hope it's help
What I can recommend and what has worked for me is to install these version packages:
"reactotron-react-native": "3.5.0",
"reactotron-redux": "3.1.0",
Then you will need to configure your store accordingly:
import {createStore, applyMiddleware, compose, combineReducers} from 'redux';
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));
const store = createStore(appReducer, composeEnhancers(middleware, Reactotron.createEnhancer()));
Now of course, the above is my setup but you will need to tweak yours accordingly, the main point being follow the Configuration as documented here:
https://github.com/infinitered/reactotron/blob/master/docs/plugin-redux.md
This question has been asked before but I cannot find a working solution so I'm taking the liberty to show my code in case I am missing something. I have a react native app and using redux. I have been using remote-redux-devtools for two months on this project now, but the tool stopped working all of a sudden. I receive a "SocketProtocolError" in the console and will paste that below as well as my code.
Redux store
import { createStore, applyMiddleware } from "redux";
import { composeWithDevTools } from "remote-redux-devtools";
import thunk from "redux-thunk";
import reducers from "../../State/reducers/index";
const composeEnhancers = composeWithDevTools({ realtime: true });
const store = createStore(
reducers,
{},
composeEnhancers(applyMiddleware(thunk))
);
export default store;
In my package.json file I am using "remote-redux-devtools": "^0.5.13"
This is the error I get in the console.
Any help would be greatly appreciated!
I fixed the same error when debugging an app on my phone by running:
adb reverse tcp:5678 tcp:5678
to allow the phone to connect to the devtools. Adjust the port number if using a different one. If you're running the app in an emulator on your computer, this probably won't help.