我是react和react-native的新手。我的配置文件如下：

package.json

{
  "name": "TEST",
  "version": "1.0.0",
  "main": "node_modules/expo/AppEntry.js",
  "scripts": {
    "start": "expo start",
    "android": "expo start --android",
    "ios": "expo start --ios",
    "web": "expo start --web",
    "lint": "eslint . **/*.ts *.tsx"
  },
  "dependencies": {
    "expo": "~49.0.15",
    "expo-status-bar": "~1.6.0",
    "react": "18.2.0",
    "react-dom": "18.2.0",
    "react-native": "0.72.5"
  },
  "devDependencies": {
    "@babel/core": "^7.20.0",
    "@expo/webpack-config": "^19.0.0",
    "@tsconfig/react-native": "^3.0.2",
    "@types/jest": "^29.5.7",
    "@types/react": "^18.2.34",
    "@types/react-dom": "^18.2.14",
    "@types/react-native": "^0.72.5",
    "@types/react-test-renderer": "^18.0.5",
    "@typescript-eslint/eslint-plugin": "^6.9.1",
    "babel-plugin-module-resolver": "^5.0.0",
    "eslint": "^8.52.0",
    "eslint-config-airbnb-base": "^15.0.0",
    "eslint-plugin-import": "^2.29.0",
    "eslint-plugin-react": "^7.33.2",
    "eslint-plugin-react-native": "^4.1.0",
    "prettier": "^3.0.3",
    "react-native-web": "~0.19.6",
    "typescript": "^5.2.2"
  },
  "resolutions": {
    "@types/react": "17.0.14",
    "@types/react-dom": "17.0.14"
  },
  "private": true,
  "license": "MIT"
}

字符串

tsconfig.json文件系统

{
  "extends": "@tsconfig/react-native/tsconfig.json",
  "compilerOptions": {
    "rootDir": ".",
    "baseUrl": ".",
    "sourceMap": true,
    "outDir": "dist",
    "target": "es2020",
    "module": "esnext",
    "lib": ["es2021", "dom"],
    "jsx": "react-native",
    "esModuleInterop": true,
    "paths": {
      "@/*": [
        "src/*"
      ],
      "react": [ "./node_modules/@types/react" ]
    },
    "forceConsistentCasingInFileNames": true,
    "strict": true,
    "noImplicitOverride": true,
    "noPropertyAccessFromIndexSignature": true,
    "noImplicitReturns": true,
    "noFallthroughCasesInSwitch": true
  },
  "types": ["react-native"],
  "include": ["src/**/*.ts", "src/**/*.tsx"],
  "exclude": [
    "node_modules",
    "babel.config.js",
    "metro.config.js",
    "jest.config.js"
  ],
}

型
我将react-native中的以下代码复制到我的App.tsx文件中，以验证一切都正常工作：

import { StatusBar } from 'expo-status-bar';
import React from 'react';
import { StyleSheet, Text, View } from 'react-native';

const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: '#fff',
    alignItems: 'center',
    justifyContent: 'center',
  },
});

export default function App() {
  return (
    <View style={styles.container}>
      <Text>Open up App.js to start working on your app!</Text>
      <StatusBar style="auto" />
    </View>
  );
}

型
我有以下错误：

• TS 2607：JSX元素类不支持属性，因为它没有props属性。
• TS 2786：文本不能用作JSX组件。
• TS 2786：视图不能用作JSX组件。

我已经尝试了我在网络上找到的大多数解决方案，在stackoverflow和reddit上，但没有一个解决了我的问题。
特别是我试图：

• 将"resolutions": { "@types/react": "^18.2.0", "@types/react-dom": "^18.2.0" },添加到我的package.json并启动yarn install（在删除node_modules和yarn.lock之后）
• 我试着把相同的版本（18.2.X）到@types/react, @types/react-dom, react, react-dom)
• 将"jsx": "react-native"和"paths": { "react": [ "./node_modules/@types/react" ] }添加到我的tsconfig.json
• 在App中使用React片段（<React.Fragment> </React.Fragment>）或空tap（<> </>） Package 组件
• 我运行了yarn add @types/react@latest @types/react-dom@latest --dev和yarn add react@latest react-dom@latest（在删除node_modules和yarn.lock之后）

我不知道我还尝试了什么，但不幸的是，我仍然没有找到解决方案。所有这一切对于那些第一次接触一种新技术的人来说是相当令人沮丧的。