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-jsxdevexample:
// 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