ReactNativeJS: ReferenceError: Can't find variable: View

Question

I have just started react-native and trying to create first Hello, world screen but I'm getting below error

ReactNativeJS: ReferenceError: Can't find variable: View

    This error is located at:
        in Unknown
        in RCTView
        in RCTView
        in c

below is my code for App.js

import React, {Fragment,Component} from 'react';

import HelloWorldApp from './components/HelloWorldApp';
import { BrowserRouter as Router, Route } from "react-router-dom"


const App = () => {
  return (
    <Router>
        <div>
          <Route exact path='/' component={HelloWorldApp} />
       </div>
      </Router>
  );
};

export default App;

Below is my code for HelloWorldApp.js

import React, {Component} from 'react';
import {Text, View} from 'react-native';

export default class HelloWorldApp extends Component {
  render() {
    return (
      <View style={{ flex: 1, justifyContent: "center", alignItems: "center" }}>
        <Text>Hello, world!</Text>
      </View>
    );
  }
}

I have already import this import {Text, View} from 'react-native'; but still I'm getting error Can't find variable: View

Below are some links that i have already check but it didn't help me to solve my issue

UPDATE

I have tried this Delete and re-install the node modules

Now I'm getting this error

ReactNativeJS: Error: Invariant failed

    This error is located at:
        in l
        in f
        in RCTView
        in RCTView
        in c

can anybody tell me what I'm missing

Can anybody help me to solve this issue

If need more information please do let me know. Thanks in advance. Your efforts will be appreciated.

If this suddenly happens have you try to close all files and rerun them again? I had situations that fixed by rerunning — behzad
– behzad, Commented Sep 24, 2019 at 6:44
Sorry to hear, if this is first time you are running , it may be other things (like not installing dependencies ) but if this happened out of blue that was the only thing that I can think of, few times I had strange error like yours, and when I closed all programs and run them again, it fixed. By the way I hope you find a way to fix soon. — behzad
– behzad, Commented Sep 24, 2019 at 6:52

morteza moradi · Accepted Answer · 2019-09-24 07:07:21Z

0

there is no problem in your code.you should only try react-native init example again and enjoy on another directory

edited Sep 24, 2019 at 7:07

answered Sep 24, 2019 at 7:04

morteza moradi

1432 silver badges9 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Goku Over a year ago

react-native init This package has been deprecated

Rishav Kumar · Accepted Answer · 2019-09-24 07:12:21Z

0

Might be some issues while loading.

Do one thing :

Close the packager and restart the packager along with closing and deleting the app and reinstalling it.

OR

Delete and re-install the node modules

App.js

import React, {Fragment,Component} from 'react';

import HelloWorldApp from './components/HelloWorldApp';
import { BrowserRouter as Router, Route } from "react-router-dom"


const App = () => {
  return (
    <Router>

          <Route exact path='/' component={HelloWorldApp} />

      </Router>
  );
};

export default App;

edited Sep 24, 2019 at 7:12

answered Sep 24, 2019 at 6:50

Rishav Kumar

5,5202 gold badges19 silver badges34 bronze badges

9 Comments

Goku Over a year ago

Thanks i have tried this deleting the app and reinstalling it. but it didn't help me, can you please explain more about this Delete and re-install the node modules solution

Rishav Kumar Over a year ago

delete the node modules folder from root. And then do npm install. Have you tried closing the packager.

Goku Over a year ago

Have you tried closing the packager how to close packager

Goku Over a year ago

i have tried Delete and re-install the node modules now I'm getting this error ReactNativeJS: Error: Invariant failed This error is located at: check updated question

Rishav Kumar Over a year ago

The terminal which opens or the starter which opens when you run a react project which bundles your file.

|

venkatesh .M · Accepted Answer · 2019-09-24 11:05:03Z

0

import React,{Component} from 'react'; import {View,Text} from 'react-native';

export default class App extends React.Component {

render(){ return ( Hello world!! ) } }

1.Create new react native project 2.Delete App.js code 3.And paste this code in App.js 4.run.

answered Sep 24, 2019 at 11:05

venkatesh .M

1

Comments

mullac · Accepted Answer · 2019-10-04 06:10:43Z

-1

import React, { Component } from 'react';
import {View,Text} from 'react-native';

export default class App extends Component {

   render(){
        return(
          <View>
               <Text>Hello world</Text>
          </View>
          )
    }
}

Create new project
Delete App.js code
and paste this code in App.js
run

edited Oct 4, 2019 at 6:10

mullac

6936 silver badges17 bronze badges

answered Sep 24, 2019 at 11:00

venkatesh .M

1

Collectives™ on Stack Overflow

ReactNativeJS: ReferenceError: Can't find variable: View

4 Answers 4

1 Comment

9 Comments

Comments

Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

1 Comment

9 Comments

Comments

Comments

Linked

Related