TypeScript 和 React 问题

Question

好吧，最近我开始使用 React.js 库，现在我正尝试将它与 Firebase 托管和 TypeScript 语言一起使用。但是，每次我尝试使用 tsx 编写一些代码时，它都不起作用，例如：

import * as React from "react"; //red underline under "react"
import "./App.css";

import logo from "./logo.svg";

class App extends React.Component {
  render() {
    return <h1>Hello</h1>; //red underline under <h1> and </h1>
  }
}

export default App;

这样我就不能在这里写任何 jsx 代码，因为它总是出现问题：

test.tsx(1,1): error TS7026: JSX element implicitly has type 'any' because no interface 'JSX.IntrinsicElements' exists

有人可以帮我解决这个问题吗？

Answer 1

你是如何创建你的 React 应用程序的？如果您使用 create-react-app you'll need to use react-scripts-ts 作为您的 --scripts-version 标志。这应该与 React 的依赖项一起安装 @types 包，从而消除您的问题。

此外，它应该让您从 App.tsx 文件开始，因为您的代码片段中提供的文件不是有效的打字稿反应组件（即您的 render() 方法不是 public） .

祝您黑客愉快！

Answer 2

我通过重新加载 VSCode 解决了这个问题。 ctrl+shift+P > Developer: Reload Window

TypeScript 和 React 问题

TypeScript and React issue

jsx

firebase

reactjs

firebase-hosting

tsx