如何避免使用TypeScript时出现FlexPlugins错误？

Question

当我使用Twilio插件CLI创建一个TypeScript项目(FlexUI2.x)时，在作为模板创建的代码中会出现一个错误。

TypeScript error in /Users/katsumi/Documents/workspace/twilioFlex/plugin-typescript-yarn/src/components/CustomTaskList/CustomTaskList.tsx(16,6):
Type '{ children: Element; theme: "default"; }' is not assignable to type 'IntrinsicAttributes & ThemeProviderProps'.
  Property 'children' does not exist on type 'IntrinsicAttributes & ThemeProviderProps'.  TS2322

    14 |
    15 |   return (
  > 16 |     <Theme.Provider theme="default">
       |      ^
    17 |       <Alert onDismiss={dismiss} variant="neutral">
    18 |       <Text as="span">This is a dismissible demo component.</Text>
    19 |       </Alert>

用于安装的命令如下所示。我使用twilio-cli/3.6.0达尔文-x64节点-v16.0和@twilio/plugin 5.1.2

twilio flex:plugins:create plugin-typescript-yarn -s -i -y --flexui2

我认为问题就在Twilio粘贴方面，但有谁有解决办法吗？

Answer 1

我相信这与React和React的类型有关。Flex有一个对等依赖的resolves *，这是目前决定反应18。

然而，Twilio应该使用v17。您可以尝试在package.json中添加以下内容

 "resolutions": {
    "@types/react": "17.x",
    "@types/react-dom": "17.x"
  }

然后删除节点模块和包锁，然后重新运行npm install或yarn来安装这些模块，看看这是否解决了问题。它应该将反应版本绑定到17。