When I import Paypal-Rest-SDK and try running:
react-native run-android
An error occurs:
"undefined is not a function(evaluating 'r(d[9]).configure')"
Before this error occurred, I deleted the node_modules folder and reinstalled all modules again, because I had a similar error with "evaluating process.versions.openssl". when I call node -p process.versions, the following is printed:
{ http_parser: '2.8.0',
node: '8.12.0',
v8: '6.2.414.66',
uv: '1.19.2',
zlib: '1.2.11',
ares: '1.10.1-DEV',
modules: '57',
nghttp2: '1.32.0',
napi: '3',
openssl: '1.0.2p',
icu: '60.1',
unicode: '10.0',
cldr: '32.0',
tz: '2017c' }
and my Code is the following for using the paypal-sdk:
'use strict';
import React, {Component} from 'react';
import {Platform, StyleSheet, Text, View, TouchableHighlight, Linking} from 'react-native';
var paypal = require('paypal-rest-sdk');
paypal.configure({
mode: 'sandbox', // Sandbox or live
client_id: 'x',
client_secret: 'y'});
export default class Paypal extends Component{
constructor(props)
{
super(props);
console.log(process);
}
render()
{
return(
<View>
<Text>This is gonna be a PayPal Thing</Text>
</View>
);
}
}
I hope someone can help me. I've googled almost the entire day for this issue.
UPDATE :
The Problem is not the include of the paypal-rest-sdk, but the next line when I try to configure the paypal variable. The error dissapears when I comment them out ...but as far as I know it is necessary to configure that
Update No.2
After running
npm install --save paypal-rest-sdk
I'm back at the problem
undefined is not an object (evaluating 'process.versions.openssl')
You are using paypal-rest-sdk which is NodeJS PayPal SDK, I belive it is not compatible with React Native. I suggest to try something React Native specific like
https://www.npmjs.com/package/react-native-paypal-wrapper
https://www.npmjs.com/package/react-native-paypal
Or use plain PayPal rest API https://developer.paypal.com/docs/api/overview/#api-requests
Related
I have this basic React Native Code which fails to compile as soon as I import anything from react-native-router-flux. It throws Module not found: Can't resolve '#react-navigation/core'
If I uncomment line import { Router, Scene } from "react-native-router-flux";, everything works fine. I also manually did npm install #react-navigation/core but to no avail
import React from "react";
import { Router, Scene } from "react-native-router-flux";
class Index extends React.Component {
render() {
return <div></div>
}
}
export default Index;
What could I be missing?
Versions
React v17.0.2
react-native-router-flux v4.3.1
React-native v0.66.3
The latest react-native version (v0.66.3) is incompatible with react-native-router-flux (v4.3.1) which is pretty old. Its better to look for #react-navigation/native
Thanks #XplosiVe06 for pointing out
The code in app.js file with import statements for react redux is created to display a header with a text called "Tech stack".
App.js
import React from 'react';
import { View } from 'react-native';
import { Header } from './components/common';
import { Provider } from 'react-redux';
import { createStore } from 'redux';
import reducers from './reducers';
const App = () => {
return(
<Provider store={createStore(reducers)}>
<View>
<Header headerText="Tech Stack" />
</View>
</Provider>
);
};
export default App;
This is the index file
index.js
import { AppRegistry } from 'react-native';
import App from './src/App';
AppRegistry.registerComponent(tech_stack, () => App);
While running this on the terminal, it throws a error saying unable to resolve module 'react-redux'.
Close the JS bundle(a terminal starts when you run app for first time) and rerun it using the command react-native start from the project path. Basically, you need to rerun the JS bundle after every package installation.
Install 'react-redux' by using
npm install --save react-redux
if you not installed it. By seeing your comment as you mentioned that you installed redux only.
Then restart the JS bundle by using
react-native start --reset-cache
I've faced this issue just now. actually, Our (you and I) main issue is naming the global state folder name is redux and the bundler falls in a conflict because there is a folder inside node_modules that name is redux too.
In fact, the main issue is this line:
import { createStore } from 'redux';
I renamed the resux stuffs folder to reduxStore instead of redux and then everything works properly.
This error occurs because you do not have Redux-Thunk middleware installed on your application. To install run:
npm install redux-thunk
Then, restart your application:
react-native start
More information: https://github.com/reduxjs/redux-thunk
I just ran into this problem and solved it by installing redux in addition to react-redux. Apparently, react-redux requires it.
I try to use swiper from this library https://github.com/leecade/react-native-swiper
Here is my dependencies:
"react": 16.3.1,
"react-native": "~0.55.2",
"react-native-swiper": "^1.5.13"
But when i just add this code import Swiper from 'react-native-swiper';
My component like:
import React, { Component } from 'react';
import { View, Text } from 'react-native';
import Swiper from 'react-native-swiper';
class Welcome extends Component {
render() {
return (
<View>
<Text>Welcome</Text>
</View>
);
}
}
export default Welcome;
It will shows error even i don't use the <Swiper />
error:
Failed to load bundle
Check my terminal error shows:
error: bundling failed: Error: While trying to resolve module `react-native-swiper` from file `/Users/huaweb/ReactNativeProject/Huaweb/src/components/Welcome.js`, the package `/Users/huaweb/ReactNativeProject/Huaweb/node_modules/react-native-swiper/package.json` was successfully found. However, this package itself specifies a `main` module field that could not be resolved (`/Users/huaweb/ReactNativeProject/Huaweb/node_modules/react-native-swiper/index.js`. Indeed, none of these files exist:
I don't know what is However, this package itself specifies amainmodule field that could not be resolved
I can't figure it out. Is any thing i miss it ?
Any help would be appreciated, thanks in advance.
In node_modules find the folder react-native-swiper and do so, It worked for me
replace :
module.exports = Swiper;
module.exports.default = Swiper;
by
export default Swiper
export {Swiper}
try with:
import Swiper from 'react-native-swiper/src';
I've got a strange situation where suddenly my RN app won't load any of its scenes. The app has been running fine for weeks and I haven't moved any of the files. The failure:
error: bundling: UnableToResolveError: Unable to resolve module `./src/scenes/splash` from `/Users/jcollum/projects/starsApp/index.ios.js`: Directory /Users/jcollum/projects/starsApp/src/scenes/splash doesn't exist
at Promise.resolve.then (/Users/jcollum/projects/starsApp/node_modules/react-native/packager/src/node-haste/DependencyGraph/ResolutionRequest.js:445:15)
at process._tickCallback (internal/process/next_tick.js:109:7)
My import statements look like:
import React, { Component } from 'react';
import { AppRegistry, StyleSheet, Text, View } from 'react-native';
import { Router, Scene } from 'react-native-router-flux';
import Icon from 'react-native-vector-icons/FontAwesome';
import Splash from './src/scenes/splash';
The scene definitely exists:
$ ll /Users/jcollum/projects/starsApp/src/scenes/splash.js
-rw-r--r-- 1 jcollum staff 722B Apr 26 10:12 /Users/jcollum/projects/starsApp/src/scenes/splash.js
And it has an export default:
import React, { Component, PropTypes } from 'react';
import { View, Text, TouchableHighlight, Image } from 'react-native';
import styles from '../styles'
import { Actions } from 'react-native-router-flux';
export default class Splash extends Component {
componentWillMount() {
setTimeout(() => {
Actions.Home()
}, 1000);
}
render() {
console.log(`rendering Splash`);
return (
<View ...
Things I have tried:
restarting packager
resetting content and settings
checking out a previous commit
clearing temp dir: rm -fr $TMPDIR/react-*
react-native --version
react-native-cli: 2.0.1
react-native: 0.43.2
What could be causing this? Why would this suddenly stop loading resources? What's the next thing to try?
Solution (don't know why this works, sorry):
Stop any running packager
Add this to package.json: "clean-start": "rm -rf node_modules && yarn install && rm -rf $TMPDIR/react* && npm start --reset-cache", (or npm install if you don't use yarn)
npm run clean-start
I faced the similar issue once and what i did was nothing fancy, I just cut all the files which were giving error and copied at some place(outside my project dir) and then paste those files again at their place helped me..
Cheers :)
In my case, ran
npm cache verify
in console at my project directory, all was well. Hope it helps
I'm new to react native so this must be easy:
My (simple) application:
index.android.js
import SearchContainer from './components/SearchContainer.jsx';
AppRegistry.registerComponent('MyFirstApp', () => SearchContainer);
and in components/SearchContainer.jsx:
import React, { Component } from 'react';
export default class SearchContainer extends Component {
....
}
but I'm getting
Requiring unknown module "./components/SearchContainer.jsx".If you are sure the module is there, try restarting the packager or running "npm install".
I've tried a moving the SearchContainer to the same directory as index.android.js and I get the same thing.
Thanks a bunch in advance, friends!
Ok, I found out a way this will work, but I'm not sure what the science behind it is - I guess "jsx" is a take over from React that simply doesn't belong.
I simply changed "jsx" to "js" and it worked.