create-react-app 和 TypeScript 错误：使用 JSX 时“React”必须在范围内

Question

我使用 CLI 命令create-react-app client --typescript用 TypeScript 初始化了一个 React 项目。 然后，我运行npm start但收到以下编译错误：

./src/App.js
  Line 26:13:  'React' must be in scope when using JSX  react/react-in-jsx-scope

除了删除不必要的徽标文件之外，我什至没有修改create-react-app提供的样板项目，而且我之前使用 TypeScript 完成的 React 应用程序编译得很好。 下面是我的App.tsx和index.tsx文件：（注意，在标志App.tsx被删除，我没有碰index.tsx ）

索引.tsx：

import React from 'react';
import ReactDOM from 'react-dom';
import './index.css';
import App from './App';
import * as serviceWorker from './serviceWorker';

ReactDOM.render(
  <React.StrictMode>
    <App />
  </React.StrictMode>,
  document.getElementById('root')
);

// If you want your app to work offline and load faster, you can change
// unregister() to register() below. Note this comes with some pitfalls.
// Learn more about service workers: 
serviceWorker.unregister();

应用程序.tsx：

import React from 'react';
import './App.css';

function App() {
  return (
    <div className="App">
        Lorem
    </div>
  );
}

export default App;

React和ReactDOM是导入的，那么是什么导致这个错误呢？

编辑：

我发现运行react-scripts start npm start正在将我的.tsx文件编译成.js文件，这可能导致了这个问题。 什么可能导致上述行为？

Answer 1

尝试

const RootApp:React.FC = () => {
  return (
     <React.StrictMode>
    <App />
  </React.StrictMode>
  );
}

render(<RootApp />, document.getElementById("root"));