Can't resolve 'react-native' in my project

Question

I made the tutorial small project from React official site and when I tried using some native react components such as Text and ImageBackground and I get compilation error of:

Module not found: Can't resolve 'react-native' in ...

I created my project with "npx create-react-app".

That the import I made.

import { Text, ImageBackground } from 'react-native'

I tried doing npm install and npm install 'react-native-elements' and so on... nothing worked.

Anyway here's my package.json:

{
  "name": "tutorial",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "react": "^16.12.0",
    "react-dom": "^16.12.0",
    "react-scripts": "3.2.0"
  },
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject"
  },
  "eslintConfig": {
    "extends": "react-app"
  },
  "browserslist": {
    "production": [
      ">0.2%",
      "not dead",
      "not op_mini all"
    ],
    "development": [
      "last 1 chrome version",
      "last 1 firefox version",
      "last 1 safari version"
    ]
  }
}

Any ideas?

Answer 1

React projects and React Native projects are different. You have to use React Native CLI

Answer 2

To create a new react-native project run this command from your cmd / terminal:

react-native init

The reason why you are facing this issue is that the required modules are not included in your package.json . Once you run the above mentioned command the npm will install all the required dependencies that are needed for your project. The command that you have mentioned in your question doesn't do what's expected.

Answer 3

For React Native Mobile App

Using this command to create react native project android and ios application.

npx react-native init AwesomeProject

You need some other configuration also to run this project like node.js,android studio, android sdk and xcode for ios. You can follow this link for more detail.

https://facebook.github.io/react-native/docs/getting-started

For React Web App

npx create-react-app above command is used for react native web app.