Antd Pro项目在VS Code中出现TypeScript组件类型错误求助

错误信息 #

'ProFormSelect' cannot be used as a JSX component.
  Its type '(<T = any>(props: ProFormSelectProps<T>) => ReactElement<any, string | JSXElementConstructor<any>>) & { SearchSelect: <T>(props: ProFormSelectProps<...>) => ReactElement<...>; }' is not a valid JSX element type.
    Type '(<T = any>(props: ProFormSelectProps<T>) => ReactElement<any, string | JSXElementConstructor<any>>) & { SearchSelect: <T>(props: ProFormSelectProps<...>) => ReactElement<...>; }' is not assignable to type '(props: any, deprecatedLegacyContext?: any) => ReactNode'.
      Type 'ReactElement<any, string | JSXElementConstructor<any>>' is not assignable to type 'ReactNode'.
        Property 'children' is missing in type 'ReactElement<any, string | JSXElementConstructor<any>>' but required in type 'ReactPortal'.

项目环境及核心依赖 #

Environment: Windows 11, Latest Visual Studio Code
Nodejs: v18.17.0

Main packages info: 

    "react": "^17.0.0",
    "react-dom": "^17.0.0",
    "typescript": "^4.5.0",

    "@types/react": "^17.0.0",
    "@types/react-dom": "^17.0.0",

    "@umijs/fabric": "^2.8.0",

    "@ant-design/compatible": "^1.1.0",
    "@ant-design/icons": "^4.7.0",
    "@ant-design/pro-card": "^1.19.0",
    "@ant-design/pro-descriptions": "^1.10.0",
    "@ant-design/pro-form": "^1.64.0",
    "@ant-design/pro-layout": "^6.35.0",
    "@ant-design/pro-table": "^2.71.0",
    "@babel/runtime": "^7.20.6",
    "@lexical/react": "^0.3.6",
    "@tinymce/tinymce-react": "^4.1.0",
    "@umijs/route-utils": "^2.0.0",
    "antd": "^4.19.0",

解决方案 #

• 清除依赖缓存并重新安装
  1. 删除项目根目录下的node_modules文件夹、package-lock.json（或yarn.lock）文件
  2. 执行npm install（或yarn install）重新安装依赖
• 重启VS Code的TypeScript服务
  打开命令面板（快捷键Ctrl+Shift+P），执行TypeScript: Restart TS Server命令，清除TS服务缓存
• 锁定依赖版本避免漂移
  检查package.json中依赖的版本号，将^符号去掉（比如把"react": "^17.0.0"改为"react": "17.0.0"），确保重装后安装的是指定版本，避免版本不兼容
• 检查全局与本地TypeScript版本一致性
  执行tsc -v查看全局TS版本，执行npx tsc -v查看项目本地TS版本，若不一致，可通过npm install typescript@4.5.0 -g将全局版本同步到项目指定版本
• 验证Antd Pro组件与Antd版本兼容性
  当前使用的antd@4.19.0与@ant-design/pro-form@1.64.0需确保版本兼容，若仍有问题，可尝试将Pro组件版本调整为与Antd 4.x匹配的稳定版本（比如升级@ant-design/pro-form到适配antd 4.19.x的最新小版本）

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