Posts

Showing posts with the label react-native

React Native error 'Unable to resolve module `react-native` '

React Native error 'Unable to resolve module `react-native` ' I am attempting to learn React Native so I went ahead and followed all the steps in the Getting Started guide at the official documentation site. I have some experience with React so i wanted to expand on it. React Native React I did wade in around 6 months ago for a simple 'hello world' app and everything worked fine for me on both the Android emulator and the IoS simulator. Did test on my device as well and had no issues. Since i got busy with other work i did not get back to it until now. The error i get when i attempt the react-native run-android command: react-native run-android Metro Bundler ready. Loading dependency graph, done. error: bundling failed: Error: Unable to resolve module `react-native` from `/Users/arunmenon/Sites/reactnative/website/index.js`: Module `react-native` does not exist in the Haste module map or in these directories: /Users/arunmenon/Sites/reactnative/website/node_modu...

React-native: POST request works from iOS app, but has empty body when submitted from Android

React-native: POST request works from iOS app, but has empty body when submitted from Android I have a react-native app that's sending a POST request for user login to a Flask-based web application behind an nginx server proxy. This is the login code: async function signInPost(csrf, email, password, data) { let reqBody = { email, password, confirm: password } const url = dispatchEndpoint(host, "signin") const resp = await request.post(url, reqBody, { headers: { 'Accept': 'application/json', 'Content-Type': 'application/json', 'X-CSRFToken': csrf, } }); const respBody = resp.data; if (respBody.status === 'success') { return Promise.resolve(data); } if (respBody.hasOwnProperty('flash')) { return Promise.reject(new Error(respBody.flash)) } if (respBody.hasOwnProperty('form') && respBody.form.hasOwnProperty('errors')) { let es...

SyntaxError: Unexpected token ' { ' while starting the reactjs app in my terminal [duplicate]

SyntaxError: Unexpected token ' { ' while starting the reactjs app in my terminal [duplicate] This question already has an answer here: I tried to run existing clone reactjs app, the following error is accured in terminal, SyntaxError: Unexpected token { at exports.runInThisContext (vm.js:53:16) at Module._compile (module.js:374:25) at Object.Module._extensions..js (module.js:417:10) at Module.load (module.js:344:32) at Function.Module._load (module.js:301:12) at Function.Module.runMain (module.js:442:10) at startup (node.js:136:18) at node.js:966:3 Here my start.js coding from (myappname)/node_modules/react-scripts/scripts/start.js:31 start.js (myappname)/node_modules/react-scripts/scripts/start.js:31 const { choosePort, createCompiler, prepareProxy, prepareUrls, } = require('react-dev-utils/WebpackDevServerUtils'); Then how to solve this problem? This question has been asked before and already has an answer. If those answers do not fully addre...

Bundlejs error on release build in Xcode (react-native)

Image
Bundlejs error on release build in Xcode (react-native) For some reason I am getting the following error when building a release version of my application via react-native. *** Terminating app due to uncaught exception 'RCTFatalException: Unhandled JS Exception: t.typeof is not a function. (In 't.typeof("function"==typeof Symbol?Symbol.iterator:"@@iterator")', 't.typeof' is undefined) (/Users/../THEAPP.app/main.jsbundle:11)', reason: 'Unhandled JS Exception: t.typeof is not a function. (In 't.typeof("function...' This is the source of the code that has the above error that I found in my bundlejs file: !(function(e){"use strict";var r,t=e.babelHelpers={};t.typeof="function"==typeof Symbol&&"symbol"===t.typeof("function"==typeof Symbol?Symbol.iterator:"@@iterator")? I have tried both of these methods of a release build: react-native bundle --entry-file index.js --platfor...

Nested TabNavigator inside StackNavigator: controlling the header

Nested TabNavigator inside StackNavigator: controlling the header I have a setup much like this: let Tabs = createBottomTabNavigator({ screen1: Screen1, screen2: Screen2 }) let Stack = createStackNavigator({ tabs: Tabs otherScreen: OtherScreen }) The stack navigator has a header, and that's fine. What I want is to get different header icons depending on what tab I'm currently on. I'm using the following versions: "react": "16.3.1", "react-native": "~0.55.2", "react-navigation": "^2.2.5" I've considered switching up my setup so that each tab screen has its own StackNavigator but I like having the sliding animation when switching tabs and I don't want the header icons to slide along. The header bar should remain static but simply show different icons depending on the current tab. StackNavigator This question has not received enough attention. 4 Answers ...

Redux action is working but reducer is not

Redux action is working but reducer is not Not sure why my reducer is not working. I have a console.log in my actions file. So for example, when I test out a failed login attempt, I see the console log in both the loginFromAPI function and loginFailure function (see in actions.js below) . These are outputting what is expected. But for some reason, the login reducer is not working. When I console.log in the loginReducer.js , I see nothing. This tells me that although the action is working, the reducer is not. My redux props do not change from the initial state (I've checked this by outputting to the console). I'd appreciate any help solving this issue. Here is the file structure: app reducers loginReducer.js rootReducer.js screens Login Login.js index.js actions.js store configureStore.js App.js actionTypes.js File configureStore.js configureStore.js import { createStore, applyMiddleware } from 'redux'; import a...

Native Base two headers

Native Base two headers I have created the header with title and right icon by using native base. However, there are two headers showing on my simulator. I have no idea what is going on. Can someone help me with this? import React, { Component }from 'react'; import { StyleSheet } from 'react-native'; import { Icon, Button, Container, Header, Content, Left, Right, Body,Text, Title } from 'native-base'; class Landing extends Component { render() { return ( <Container> <Header> <Left /> <Body> <Title> Title </Title> </Body> <Right> <Button transparent> <Icon name="ios-menu" onPress={() => this.props.navigation.navigate('DrawerOpen')} /> </ Button> ...

how to interact with detox running in a react native app

how to interact with detox running in a react native app My current workflow when writing tests w/ detox is roughly following: atIndex As you can tell, the workflow is not ideal because I'm basically guessing what the test code should look like. Instead, I'd like to be able to "connect to detox" that runs inside the app and send the commands to it. That would allow me to figure out the correct commands and then just place them into the test and would avoid the "repeat" step I mentioned above. More specifically, I'd like to be able to set something like a breakpoint in a detox test and when I hit it, I'd like to be able to execute actions like await element(by.text('Done')).tap(); . await element(by.text('Done')).tap(); Or alternatively, I'd like to build the app with detox build , then manually get to a certain screen in the app and then again "connect to detox" and start executing the actions. detox build Is this now po...

Possible Unhandled Promise Rejection (id: 0): ReferenceError: user is not defined ReferenceError: user is not defined

Possible Unhandled Promise Rejection (id: 0): ReferenceError: user is not defined ReferenceError: user is not defined I have stored data user with AsyncStorage when i want to get it, it renders null in alert and the above error in the console,i don't know why. I can not see why it returns null with user but token all is well profile.js : import React, {Component} from 'react'; import { StyleSheet, Text, View, Image, TouchableOpacity,AsyncStorage} from 'react-native'; import { Container, Content, Header,Right, Left, Body} from 'native- base'; import Feather from 'react-native-vector-icons/Feather'; export default class Profile extends Component { constructor (props){ super(props); this.state = { user: null } } componentDidMount(){ this.fetchData(); } fetchData = async() =>{ let username = await AsyncStorage.getItem('user') this.setState({ user: username }) ...

show difference in 2 times

Image
show difference in 2 times Its giving me like this instead of showing how many hours its showing "in hrs" but the real issue is even though the date is todays and time should show in minutes its giving me in hours.. I have to display time based on condition that if the order has been placed few minutes earlier it should show "1 min" , if few hours ago then "18 hr" if it is not of the present date it should show date in the format "29/06/18" . using moment.js any help is appreciated. "1 min" "18 hr" "29/06/18" moment.js This is my code: export class Notifications extends PureComponent { constructor(props) { super(props); this.state = { notificationsData: null, isLoading: true }; } componentDidMount() { if (notifications) { this.setState({ notificationsData: notifications.data, isLoading: false }); } else { ...

React Native setState not a function

React Native setState not a function Can someone explain me why this.setState is not a function ? I do not see why my code has an error import React from 'react'; import axios from 'axios' import { StyleSheet, Text, View , Image} from 'react-native'; export default class App extends React.Component { constructor(){ super(); this.state = {res: } } componentDidMount() { axios.get('https://api.github.com/repos/torvalds/linux/commits') .then(function (response) { this.setState({res: response}); }).catch(function (error) { console.log(error); }); } } Thank you use arrow function to wrap this.setState({res: response}); that bring this inside arrow function – Pramendra Gupta Jun 29 at 9:51 this.setState({...

rn redux-offline delete request data/cache

rn redux-offline delete request data/cache just got stuck in configuring react-native offline requests. I want to use it to send data and image files as base64 array with it, well i got it working but after that caches grows constantly day 140mb/4h while testing in real-device, that suppose not the way it should work. What i am missing in general?. store configuration with custom request(converting images to base64) offlineConfig2 = { ...offlineConfig, persistCallback: () => { console.log('Rehydratation complete'); }, persistOptions: { key: 'primary', storage:AsyncStorage }, rehydrate: true, // @overwrite effect effect: (effect, action) => { console.log(`Executing effect for ${action.type}:`, effect); photoArr = ; if (effect.photo) photoArr = effect.photo; promises = photoArr.map(function(photo){ return base64 = RNFetchBlob.fs.readFile(photo.key, 'base64') .then((data) ...

Demographics and interests data not displaying in GA for React native app

Demographics and interests data not displaying in GA for React native app I have received each and every data under real time, audience except demographics and interest data in it, no data haven't display in this session, did anyone faced this issue in react native app using react native google analytics bridge plugin ? 1 Answer 1 "react native google analytics bridge", This plugin is working fine, but we have to wait a few days after app deployment. Then based on live data, google analytics will start analyzing the data then it will create the data relevantly under GA. This does not provide an answer to the question. To critique or request clarification from an author, leave a comment below their post. - From Review – EzLo 2 days ago ...