Expo TypeScript模板JSX类型错误排查求助

1. 修正tsconfig.json核心配置 #

Expo TypeScript项目必须继承官方基础配置，且JSX选项有特殊要求，确保你的tsconfig.json开头配置如下：

{
  "extends": "expo/tsconfig.base",
  "compilerOptions": {
    "jsx": "react-native",
    // 保留其他原有配置
  }
}

注意：jsx字段必须设为react-native，这是Expo/React Native的硬性要求，改其他值会直接引发JSX类型错误。

2. 恢复匹配版本的@types/react #

Expo项目中react和@types/react版本强绑定，手动降级会导致版本不兼容。执行命令自动安装匹配版本：

# npm用户
npm install @types/react@$(npm show react version) --save-dev
# yarn用户
yarn add @types/react@$(yarn info react version) --dev

3. 使用项目本地TypeScript执行检查 #

全局TypeScript版本可能和项目依赖版本冲突，执行tsc时务必用本地版本：

npx tsc

4. 检查文件后缀 #

所有包含JSX语法的文件必须用.tsx后缀，不能用.ts，写错后缀会直接触发"Cannot use JSX unless the '--jsx' flag is provided"错误。

5. 排查多tsconfig文件冲突 #

检查项目根目录是否存在多个tsconfig文件（如tsconfig.app.json、tsconfig.node.json），确保只有主tsconfig.json继承expo/tsconfig.base，其他子配置需正确继承主配置。

6. 清除缓存并重启编辑器 #

• 清除Expo缓存：npx expo start --clear
• 删除项目根目录的.tsbuildinfo文件（若存在）
• 重启VSCode/nvim，让编辑器重新加载tsconfig配置

7. 重装依赖修复完整性 #

删除node_modules和锁文件，重新安装依赖：

rm -rf node_modules package-lock.json
npm install

内容的提问来源于stack exchange，提问作者como