I encountered a problem that import React. This is my error
Maybe it is a normal problem and I also find some ways to solve the problem on Google. I can't solve problem now.Because I think I already has changed it.This is my code
Thanks for your help
Try Following
import React, { Component } from 'react';
import { View } from 'react-native';
Try using
import * as React from 'react';
class MyProject extends React.Component ...
Related
I'm trying to enable the new LogBox in React Native (v0.62.0-rc.2), I just have to add a line to the "index.js" file but it doesn't work.
RC2 introduces the new LogBox experience behind a feature flag. To try
it out, add the following to your index.js file:
require('react-native').unstable_enableLogBox()
index.js
require('react-native').unstable_enableLogBox();
import {AppRegistry} from 'react-native';
import App from './App';
import {name as appName} from './app.json';
AppRegistry.registerComponent(appName, () => App);
Error output:
TypeError: _$$_REQUIRE(_dependencyMap[1], "react-native").unstable_enableLogBox is not a function.
I'm sure I'm doing something wrong, maybe it's not the right way.
you need to do the following:
create a file in the project root title it intro.js
add require('react-native').unstable_enableLogBox(); to intro.js
add import './intro'; at the top of index.js
This worked with me.
Here's how I did it. For some reason imports get resolved super early, which seems to cause the following error:
Error: LogBox must be enabled before AppContainer is required so that it can properly wrap the console methods.
Please enable LogBox earlier in your app.
Move the contents of your entrypoint (usually index.js) to another file (_index.js for example), then require() it from your entrypoint AFTER enabling the logbox:
if(__DEV__)
require('react-native').unstable_enableLogBox();
require('./_index');
import {name as appName} from './app.json';
require('react-native').unstable_enableLogBox();
please write in simple manner I mentioned above please check screen shot for Log box.
First of all, identify where is the main file of your entire app. For example, if you are using a file like Reactotron config file you will put this line before all imports:
require('react-native').unstable_enableLogBox();
Therefore, if you are not using something like Reactotron you will put the above line, before your App import on index.js in the root of project, like this:
require('react-native').unstable_enableLogBox();
...
import { AppRegistry } from 'react-native';
import App from './src/App';
import { name } from './app.json';
AppRegistry.registerComponent(name, () => App);
I hope i've helped! =)
According to the React Native docs this is how you would implement it:
import { LogBox } from 'react-native';
// Ignore log notification by message:
LogBox.ignoreLogs(['Warning: ...']);
// Ignore all log notifications:
LogBox.ignoreAllLogs();
I did this at the very top of App.js and it worked great.
Hell, I'm trying to create a tab bar in my react native app, but after importing it, it appears it's always undefined. Has this component been deprecated? I still see it listed in the docs. https://facebook.github.io/react-native/docs/tabbarios.html
import React, { Component } from 'react';
import {
TabBarIOS
} from 'react-native';
export default class App extends Component {
render() {
return (
<TabBarIOS/>
);
}
}
I'm using react-native 0.59.3
Looks like this has been removed as part of a core cleanup effort. There doesn't appear to be any native alternative that also behaves correctly on tvos.
https://github.com/facebook/react-native/commit/02697291ff41ddfac5b85d886e9cafa0261c8b98
I've gone ahead and extracted TabBarIOS out into a native module for anyone looking for this.
https://github.com/modavi/NativeIOS
install instructions:
npm install git+https://github.com/modavi/NativeIOS#master
react-native link native-ios
I am trying to import my second file into App.js for my project. I am getting the error "The development server returned response error code: 500". Basically saying "Unable to resolve "MainFile" from "App.js".
Why is this happening? I believe it is correct but for some reason this bugfest saying that the file doesn't exist. First code is my App.js file and the second one is the code i am trying to import.
https://gyazo.com/6911c477f9c9e8149370571ca49a0b9f
https://gyazo.com/73f0079bc6a2640877bcc30fa1e609ec
import React from 'react';
import MainFile from './components/MainFile';
export default class App extends React.Component{
render() {
return(
<MainFile />
);
}
}
import React from 'react';
import {StyleSheet, Text, View, TextInput, ScrollView, TouchableOpacity} from 'react-native';
export default class MainFile extends React.Component{
render(){
return(
<View style={styles.container}>
<Text>Testing</Text>
</View>
);
}
}
const styles = StyleSheet.create({
container: {
},
});
Double check if file exist at given path or not
If file is not javascript(.js), then mention the extension
Try using double quote when referring to file ( e.g. "./src/..")
If file to import is not .js, then make sure appropriate react library is imported in first import
E.g.( import {..., Image } from 'react-native' )
delete node_modules folder
edit package json : react-native version to "55.4" or "55.2" and
babel-preset-react-native to "4.0.0" ( if your version is different
try to use the latest one or downgrade it).
run npm install or yarn install command
you're done
Source : Github
In my situation i changed ./MainFile to ./MainFile.js and it start worked. this should work without specifying extension. But something went wrong and he needed it
You need to add an index.js or ts page in the folder from which you are importing components and then write an export statement for component in that index.js page.
add export just like follows then import should work -
export { default as Home } from './Home'
I was getting this error while adding a View component in .tsx file.
I raised this question and answered myself as I thought it will help others who are facing similar issue.
Please import React in your code import statements:
import * as React from 'react';
Reference:
https://github.com/Microsoft/TypeScript/issues/14118
One don't need to import everything using *
It's just react which is missing and needs to be imported so that JSX can be understood.
So just do following
import React from 'react';
Try importing in this way
import React, {Component} from 'react';
Use any of the following to remove the error:
declare var React: any;
var React;
import React from "react";
import * as React from "react";
Hai i am trying to show alert message, i tried different ways like alert,AlertIOS,Alert.alert
AlertIOS is working in IPhone but not working in android and alert also same
In Docs i saw that Alert.alert will work for both Android an IOS,But i got an error like undefined is not an object(evaluating 'Alert.alert')
I wrote like this:
Alert.alert('Alert', 'email is not valid, Please enter correct email', [{text: 'Ok'}]);
I got an error like this:
Any one give suggestions that how to show the alert in Android and IOS in react-native
Any help much appreciated
Are you sure you are including it from the correct path?
I get the same error when I imported Alert from react library and NOT react-native.
so the working thingie is:
import React, { Component } from 'react';
import { View, Alert } from 'react-native';
and the non-working one was:
import React, { Component, Alert } from 'react';
import { View } from 'react-native';
I think you forget to import Alert from react-native
import { Alert } from 'react-native';
and then you can show Alert like this
Alert.alert("Alert message");
We just need to import it correctly:
import { Alert } from 'react-native';
Then use it in your project as written in your code and it will work for both platforms :
Alert.alert('Alert', 'email is not valid, Please enter correct email', [{text: 'Ok'}]);
refer: https://facebook.github.io/react-native/docs/alert