I updated my project to create react app 4.0, and I'm slowing moving over my files to TypeScript. I know with this new version you don't have to repetitively import React from 'react'. However, within all of my TS files where I'm not importing React I receive this error 'React' refers to a UMD global, but the current file is a module. Consider adding an import instead.ts(2686)
. I know I can fix it by importing React, but I thought this was no longer needed. Also, could someone explain the meaning of this error?
My basic TSX file
const Users = () => {
return <>Teachers aka Users</>;
};
export default Users;
Create React App supports the new JSX transformation out of the box in version 4 but if you are using a custom setup, the following is needed to remove the TypeScript error when writing jsx
without import React from 'react'
:
typescript
version of at least version 4.1react
and react-dom
of at least version 17tsconfig.json
must have a jsx
compilerOption of react-jsx
or react-jsxdev
example:
// tsconfig.json
{
"compilerOptions": {
...
"jsx": "react-jsx"
...
},
}
TypeScript documentation for its support of React 17 JSX Factories can be found here
This error message comes from TypeScript compiler. The React 17 new jsx transform is not currently supported in Typescript 4.0, and will be supported in 4.1.
Adding
import React from 'react'
fixes this issue