After setting up an asp.net core project with a react template and configuring Typescript, I created a simple file named Test.tsx with the following code:
import React from 'react';
class Test extends React.Component {
render() {
return (
<div/>
);
}
}
export default Test;
However, this resulted in the following error:
Error TS1192 (TS) Module '"***/React/React/ClientApp/node_modules/@types/react/index"' has no default export.
https://i.sstatic.net/DqxvM.png
To resolve the error, I copied the file and named it Test2.tsx. Strangely, the error disappeared after this action.
https://i.sstatic.net/knBki.png
Further investigation led me to discover that if I add the file by right-clicking and selecting "Add new item" -> "TypeScript JSX File", an entry is added to the .csproj file
<ItemGroup>
<TypeScriptCompile Include="ClientApp\src\Test.tsx" />
</ItemGroup>
Removing this line eliminates the compile error. But why does this happen?? Do I have to delete this line every time I add a new TSX file?
I am using Visual Studio 2017 and TypeScript 3.1.3