Why can't I import React as "react"?

Question

Problem described here too, but the response was not elaborative React can't be found

import React from 'react' <- I know this statement is correct

Since "React" is a default export and not a named export, shouldn't this statement work too:

import react from 'react'

I know React.createElement() will be called in future, but why isn't react.createElement() correct? After all, the word "React" is just a name to refer to 'react' module.

Because js is case-sensitive. And jsx uses React.createElement() — Rashomon
– Rashomon, Commented Jan 24, 2022 at 12:05
react.createElement() is correct too if you import it with react, why you think its not? — MWO
– MWO, Commented Jan 24, 2022 at 12:17
@MWO read my answer. the compiler looks for React to compile the JSX — DevAddict
– DevAddict, Commented Jan 24, 2022 at 12:21
"React can't be found" error occurs, but we know conceptually default export can have any name therefore it must be correct @MWO. import React from 'react' is an example of default export right?? — Abhinav Gupta
– Abhinav Gupta, Commented Jan 24, 2022 at 14:02
@AbhinavGupta React is a default export and you can import it as whatever you like. The problem occurs when the compiler wants to compile your code. The compiler will look for React in order to use React.createElement for example and if you define React in any other way you will face a problem with the compiler. — DevAddict
– DevAddict, Commented Jan 24, 2022 at 15:02

DevAddict · Accepted Answer · 2022-01-24 12:20:31Z

1

In the old versions of react-scripts which uses webpack as a bundler, you need to define a React object in your code where you use JSX because when the bundler is handling your code uses the defined React object to call for the nessecerary methods like React.createElement and everywhere else that react is needed. That is why if you remove the React import or write the name in any other fashion you will face an error

answered Jan 24, 2022 at 12:20

DevAddict

2,0751 gold badge12 silver badges17 bronze badges

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

6 Comments

Abhinav Gupta Over a year ago

Are you referring to "React object" in this statement -> import React from 'react'. Earlier, I worked on a react project with latest version(v16+) and currently the react-native version I am using is latest too (v0.67). I never explicitly defined a React object as var React = require('react')

DevAddict Over a year ago

@AbhinavGupta if you read the answer you will see I explicitly said old versions. In the newer versions, you don't need to define React. Also if using typescript you set compilerOptions.jsx to preserve you don't have to define the React object.

Abhinav Gupta Over a year ago

How would you explain error at "import react from 'react' " in newer version?

DevAddict Over a year ago

@AbhinavGupta compiler sees that react has already been imported but when tries to use it can't find it.

DevAddict Over a year ago

@AbhinavGupta see compiler checks for React in the code it is right that react.createElement is not wrong but the way that compiler is written is that it uses React

|

Collectives™ on Stack Overflow

Why can't I import React as "react"?

1 Answer 1

6 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

6 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related