search

oven-sh / bun

Incredibly fast JavaScript runtime, bundler, test runner, and package manager – all in one
https://bun.sh
Other
71.82k stars 2.56k forks source link

Typecheck is acusing a lot of errors with bun #6103

Open rodrigodiasf1984 opened 9 months ago

rodrigodiasf1984 commented 9 months ago

What version of Bun is running?

1.0.2

What platform is your computer?

Mac os ventura 13.4

What steps can reproduce the bug?

install all dependencies of the project with yarn and run "typecheck": "tsc --project tsconfig.json --noEmit", bun tsc

What is the expected behavior?

look if there is any error on the entire project without looking into nodemodules

What do you see instead?

For some reason the typeck with bun is causing these errors, 

zerel-parksharing-mobile on ξ‚  rodrigo/fix-schema-to-login [!?] via β¬’ v18.16.1 via 🍞 v1.0.2 via πŸ’Ž ruby-2.7.5 
➜ bun tsc
App.tsx:75:10 - error TS2786: 'FlashMessage' cannot be used as a JSX component.
  Its instance type 'FlashMessage' is not a valid JSX element.
    The types returned by 'render()' are incompatible between these types.
      Type 'React.ReactNode' is not assignable to type 'import("/Users/rodrigodiasdefigueiredo/Desktop/zerel-parksharing-mobile/node_modules/@types/react-native/node_modules/@types/react/index").ReactNode'.

75         <FlashMessage position="bottom" />
            ~~~~~~~~~~~~

node_modules/react-native-floating-label-input/src/index.tsx:171:55 - error TS2769: No overload matches this call.
  Overload 1 of 2, '(component: ComponentClass<TextProps, any>, options?: Options<TextProps> | undefined): ComponentClass<AnimateProps<TextProps>, any>', gave the following error.
    Argument of type 'typeof Text' is not assignable to parameter of type 'ComponentClass<TextProps, any>'.
      Types of property 'contextType' are incompatible.
        Type 'import("/Users/rodrigodiasdefigueiredo/Desktop/zerel-parksharing-mobile/node_modules/@types/react-native/node_modules/@types/react/index").Context<any> | undefined' is not assignable to type 'React.Context<any> | undefined'.
          Type 'import("/Users/rodrigodiasdefigueiredo/Desktop/zerel-parksharing-mobile/node_modules/@types/react-native/node_modules/@types/react/index").Context<any>' is not assignable to type 'React.Context<any>'.
            Types of property 'Provider' are incompatible.
              Type 'import("/Users/rodrigodiasdefigueiredo/Desktop/zerel-parksharing-mobile/node_modules/@types/react-native/node_modules/@types/react/index").Provider<any>' is not assignable to type 'React.Provider<any>'.
                Types of parameters 'props' and 'props' are incompatible.
                  Type 'React.ProviderProps<any>' is not assignable to type 'import("/Users/rodrigodiasdefigueiredo/Desktop/zerel-parksharing-mobile/node_modules/@types/react-native/node_modules/@types/react/index").ProviderProps<any>'.
                    Types of property 'children' are incompatible.
                      Type 'React.ReactNode' is not assignable to type 'import("/Users/rodrigodiasdefigueiredo/Desktop/zerel-parksharing-mobile/node_modules/@types/react-native/node_modules/@types/react/index").ReactNode'.
  Overload 2 of 2, '(component: FunctionComponent<object>, options?: Options<object> | undefined): FunctionComponent<AnimateProps<object>>', gave the following error.
    Argument of type 'typeof Text' is not assignable to parameter of type 'FunctionComponent<object>'.
      Type 'typeof Text' provides no match for the signature '(props: PropsWithChildren<object>, context?: any): ReactElement<any, any> | null'.

171 const AnimatedText = Animated.createAnimatedComponent(Text);
                                                          ~~~~

node_modules/react-native-floating-label-input/src/index.tsx:583:12 - error TS2786: 'AnimatedText' cannot be used as a JSX component.
  Its instance type 'Component<AnimateProps<TextProps>, any, any>' is not a valid JSX element.
    The types returned by 'render()' are incompatible between these types.
      Type 'React.ReactNode' is not assignable to type 'import("/Users/rodrigodiasdefigueiredo/Desktop/zerel-parksharing-mobile/node_modules/@types/react-native/node_modules/@types/react/index").ReactNode'.

583           <AnimatedText
               ~~~~~~~~~~~~

node_modules/react-native-floating-label-input/src/index.tsx:606:16 - error TS2786: 'AnimatedText' cannot be used as a JSX component.
  Its instance type 'Component<AnimateProps<TextProps>, any, any>' is not a valid JSX element.

606               <AnimatedText
                   ~~~~~~~~~~~~

src/components/AccordionItem/index.tsx:23:7 - error TS2769: No overload matches this call.
  Overload 1 of 2, '(props: ViewProps | Readonly<ViewProps>): View', gave the following error.
    Type 'React.ReactNode' is not assignable to type 'import("/Users/rodrigodiasdefigueiredo/Desktop/zerel-parksharing-mobile/node_modules/@types/react-native/node_modules/@types/react/index").ReactNode'.
  Overload 2 of 2, '(props: ViewProps, context: any): View', gave the following error.
    Type 'React.ReactNode' is not assignable to type 'import("/Users/rodrigodiasdefigueiredo/Desktop/zerel-parksharing-mobile/node_modules/@types/react-native/node_modules/@types/react/index").ReactNode'.

23       {children}
         ~~~~~~~~~~

  node_modules/@types/react-native/index.d.ts:2560:5
    2560     children?: React.ReactNode;
             ~~~~~~~~
    The expected type comes from property 'children' which is declared here on type 'IntrinsicAttributes & IntrinsicClassAttributes<View> & Readonly<ViewProps>'
  node_modules/@types/react-native/index.d.ts:2560:5
    2560     children?: React.ReactNode;
             ~~~~~~~~
    The expected type comes from property 'children' which is declared here on type 'IntrinsicAttributes & IntrinsicClassAttributes<View> & Readonly<ViewProps>'

src/components/BackgroundImage/index.tsx:29:9 - error TS2769: No overload matches this call.
  Overload 1 of 2, '(props: ImageBackgroundProps | Readonly<ImageBackgroundProps>): ImageBackground', gave the following error.
    Type 'React.ReactNode' is not assignable to type 'import("/Users/rodrigodiasdefigueiredo/Desktop/zerel-parksharing-mobile/node_modules/@types/react-native/node_modules/@types/react/index").ReactNode'.
  Overload 2 of 2, '(props: ImageBackgroundProps, context: any): ImageBackground', gave the following error.
    Type 'React.ReactNode' is not assignable to type 'import("/Users/rodrigodiasdefigueiredo/Desktop/zerel-parksharing-mobile/node_modules/@types/react-native/node_modules/@types/react/index").ReactNode'.

29         {children}
           ~~~~~~~~~~

  node_modules/@types/react-native/index.d.ts:3938:5
    3938     children?: React.ReactNode;
             ~~~~~~~~
    The expected type comes from property 'children' which is declared here on type 'IntrinsicAttributes & IntrinsicClassAttributes<ImageBackground> & Readonly<ImageBackgroundProps>'
  node_modules/@types/react-native/index.d.ts:3938:5
    3938     children?: React.ReactNode;
             ~~~~~~~~
    The expected type comes from property 'children' which is declared here on type 'IntrinsicAttributes & IntrinsicClassAttributes<ImageBackground> & Readonly<ImageBackgroundProps>'

src/components/CancelRentModal/index.tsx:136:8 - error TS2786: 'DateTimePickerModal' cannot be used as a JSX component.
  Its instance type 'DateTimePicker' is not a valid JSX element.

136       <DateTimePickerModal
           ~~~~~~~~~~~~~~~~~~~

src/components/CustomButton/index.tsx:5:11 - error TS2430: Interface 'RootProps' incorrectly extends interface 'TouchableOpacityProps'.
  Types of property 'children' are incompatible.
    Type 'React.ReactNode' is not assignable to type 'import("/Users/rodrigodiasdefigueiredo/Desktop/zerel-parksharing-mobile/node_modules/@types/react-native/node_modules/@types/react/index").ReactNode'.

5 interface RootProps extends TouchableOpacityProps {
            ~~~~~~~~~

src/components/CustomButton/index.tsx:25:7 - error TS2769: No overload matches this call.
  Overload 1 of 2, '(props: TouchableOpacityProps | Readonly<TouchableOpacityProps>): TouchableOpacity', gave the following error.
    Type 'React.ReactNode' is not assignable to type 'import("/Users/rodrigodiasdefigueiredo/Desktop/zerel-parksharing-mobile/node_modules/@types/react-native/node_modules/@types/react/index").ReactNode'.
  Overload 2 of 2, '(props: TouchableOpacityProps, context: any): TouchableOpacity', gave the following error.
    Type 'React.ReactNode' is not assignable to type 'import("/Users/rodrigodiasdefigueiredo/Desktop/zerel-parksharing-mobile/node_modules/@types/react-native/node_modules/@types/react/index").ReactNode'.

25       {children}
         ~~~~~~~~~~

  node_modules/@types/react-native/index.d.ts:5100:5
    5100     children?: React.ReactNode;
             ~~~~~~~~
    The expected type comes from property 'children' which is declared here on type 'IntrinsicAttributes & IntrinsicClassAttributes<TouchableOpacity> & Readonly<TouchableOpacityProps>'
  node_modules/@types/react-native/index.d.ts:5100:5
    5100     children?: React.ReactNode;
             ~~~~~~~~
    The expected type comes from property 'children' which is declared here on type 'IntrinsicAttributes & IntrinsicClassAttributes<TouchableOpacity> & Readonly<TouchableOpacityProps>'

src/components/CustomCheckBox/index.tsx:14:11 - error TS2430: Interface 'RootProps' incorrectly extends interface 'TouchableOpacityProps'.
  Types of property 'children' are incompatible.
    Type 'React.ReactNode' is not assignable to type 'import("/Users/rodrigodiasdefigueiredo/Desktop/zerel-parksharing-mobile/node_modules/@types/react-native/node_modules/@types/react/index").ReactNode'.

14 interface RootProps extends TouchableOpacityProps {
             ~~~~~~~~~

src/components/CustomCheckBox/index.tsx:29:10 - error TS2786: 'Animated.View' cannot be used as a JSX component.
  Its instance type 'View' is not a valid JSX element.

29         <Animated.View
            ~~~~~~~~~~~~~

src/components/CustomCheckBox/index.tsx:43:7 - error TS2769: No overload matches this call.
  Overload 1 of 2, '(props: TouchableOpacityProps | Readonly<TouchableOpacityProps>): TouchableOpacity', gave the following error.
    Type 'React.ReactNode' is not assignable to type 'import("/Users/rodrigodiasdefigueiredo/Desktop/zerel-parksharing-mobile/node_modules/@types/react-native/node_modules/@types/react/index").ReactNode'.
  Overload 2 of 2, '(props: TouchableOpacityProps, context: any): TouchableOpacity', gave the following error.
    Type 'React.ReactNode' is not assignable to type 'import("/Users/rodrigodiasdefigueiredo/Desktop/zerel-parksharing-mobile/node_modules/@types/react-native/node_modules/@types/react/index").ReactNode'.

43       {children}
         ~~~~~~~~~~

src/components/Details/index.tsx:717:44 - error TS2769: No overload matches this call.
  Overload 1 of 2, '(props: ViewProps | Readonly<ViewProps>): View', gave the following error.
    Type 'React.ReactNode' is not assignable to type 'import("/Users/rodrigodiasdefigueiredo/Desktop/zerel-parksharing-mobile/node_modules/@types/react-native/node_modules/@types/react/index").ReactNode'.
  Overload 2 of 2, '(props: ViewProps, context: any): View', gave the following error.
    Type 'React.ReactNode' is not assignable to type 'import("/Users/rodrigodiasdefigueiredo/Desktop/zerel-parksharing-mobile/node_modules/@types/react-native/node_modules/@types/react/index").ReactNode'.

717         <View className="flex-1 px-4 py-3">{children}</View>
                                               ~~~~~~~~~~

  node_modules/@types/react-native/index.d.ts:2560:5
    2560     children?: React.ReactNode;
             ~~~~~~~~
    The expected type comes from property 'children' which is declared here on type 'IntrinsicAttributes & IntrinsicClassAttributes<View> & Readonly<ViewProps>'
  node_modules/@types/react-native/index.d.ts:2560:5
    2560     children?: React.ReactNode;
             ~~~~~~~~
    The expected type comes from property 'children' which is declared here on type 'IntrinsicAttributes & IntrinsicClassAttributes<View> & Readonly<ViewProps>'

src/components/Form/ErrorForm/index.tsx:24:9 - error TS2769: No overload matches this call.
  Overload 1 of 2, '(props: TextProps | Readonly<TextProps>): Text', gave the following error.
    Type 'React.ReactNode' is not assignable to type 'import("/Users/rodrigodiasdefigueiredo/Desktop/zerel-parksharing-mobile/node_modules/@types/react-native/node_modules/@types/react/index").ReactNode'.
  Overload 2 of 2, '(props: TextProps, context: any): Text', gave the following error.
    Type 'React.ReactNode' is not assignable to type 'import("/Users/rodrigodiasdefigueiredo/Desktop/zerel-parksharing-mobile/node_modules/@types/react-native/node_modules/@types/react/index").ReactNode'.

24         {children}
           ~~~~~~~~~~

  node_modules/@types/react-native/index.d.ts:1164:5
    1164     children?: React.ReactNode;
             ~~~~~~~~
    The expected type comes from property 'children' which is declared here on type 'IntrinsicAttributes & IntrinsicClassAttributes<Text> & Readonly<TextProps>'
  node_modules/@types/react-native/index.d.ts:1164:5
    1164     children?: React.ReactNode;
             ~~~~~~~~
    The expected type comes from property 'children' which is declared here on type 'IntrinsicAttributes & IntrinsicClassAttributes<Text> & Readonly<TextProps>'

src/components/Form/InputForm/index.tsx:47:13 - error TS2769: No overload matches this call.
  Overload 1 of 2, '(props: ViewProps | Readonly<ViewProps>): View', gave the following error.
    Type 'React.ReactNode' is not assignable to type 'import("/Users/rodrigodiasdefigueiredo/Desktop/zerel-parksharing-mobile/node_modules/@types/react-native/node_modules/@types/react/index").ReactNode'.
  Overload 2 of 2, '(props: ViewProps, context: any): View', gave the following error.
    Type 'React.ReactNode' is not assignable to type 'import("/Users/rodrigodiasdefigueiredo/Desktop/zerel-parksharing-mobile/node_modules/@types/react-native/node_modules/@types/react/index").ReactNode'.

47             {icon}
               ~~~~~~

src/components/FromToDatePicker/index.tsx:71:10 - error TS2786: 'DateTimePickerModal' cannot be used as a JSX component.
  Its instance type 'DateTimePicker' is not a valid JSX element.

71         <DateTimePickerModal
            ~~~~~~~~~~~~~~~~~~~

src/components/FromToDatePicker/index.tsx:91:10 - error TS2786: 'DateTimePickerModal' cannot be used as a JSX component.
  Its instance type 'DateTimePicker' is not a valid JSX element.

91         <DateTimePickerModal
            ~~~~~~~~~~~~~~~~~~~

src/components/GenericHeader/index.tsx:11:7 - error TS2769: No overload matches this call.
  Overload 1 of 2, '(props: ViewProps | Readonly<ViewProps>): View', gave the following error.
    Type 'React.ReactNode' is not assignable to type 'import("/Users/rodrigodiasdefigueiredo/Desktop/zerel-parksharing-mobile/node_modules/@types/react-native/node_modules/@types/react/index").ReactNode'.
  Overload 2 of 2, '(props: ViewProps, context: any): View', gave the following error.
    Type 'React.ReactNode' is not assignable to type 'import("/Users/rodrigodiasdefigueiredo/Desktop/zerel-parksharing-mobile/node_modules/@types/react-native/node_modules/@types/react/index").ReactNode'.

11       {children}
         ~~~~~~~~~~

  node_modules/@types/react-native/index.d.ts:2560:5
    2560     children?: React.ReactNode;
             ~~~~~~~~
    The expected type comes from property 'children' which is declared here on type 'IntrinsicAttributes & IntrinsicClassAttributes<View> & Readonly<ViewProps>'
  node_modules/@types/react-native/index.d.ts:2560:5
    2560     children?: React.ReactNode;
             ~~~~~~~~
    The expected type comes from property 'children' which is declared here on type 'IntrinsicAttributes & IntrinsicClassAttributes<View> & Readonly<ViewProps>'

src/components/LoadingModal/index.tsx:20:12 - error TS2786: 'Lottie' cannot be used as a JSX component.
  Its instance type 'AnimatedLottieView' is not a valid JSX element.
    The types returned by 'render()' are incompatible between these types.
      Type 'React.ReactNode' is not assignable to type 'import("/Users/rodrigodiasdefigueiredo/Desktop/zerel-parksharing-mobile/node_modules/@types/react-native/node_modules/@types/react/index").ReactNode'.

20           <Lottie source={loading_parking} autoPlay loop />
              ~~~~~~

src/components/Monthly/index.tsx:93:10 - error TS2786: 'DateTimePickerModal' cannot be used as a JSX component.
  Its instance type 'DateTimePicker' is not a valid JSX element.
    The types returned by 'render()' are incompatible between these types.
      Type 'React.ReactNode' is not assignable to type 'import("/Users/rodrigodiasdefigueiredo/Desktop/zerel-parksharing-mobile/node_modules/@types/react-native/node_modules/@types/react/index").ReactNode'.

93         <DateTimePickerModal
            ~~~~~~~~~~~~~~~~~~~

src/components/OpenDoorModal/index.tsx:160:16 - error TS2786: 'SwipeButton' cannot be used as a JSX component.
  Its instance type 'RNSwipeButton' is not a valid JSX element.
    The types returned by 'render()' are incompatible between these types.
      Type 'React.ReactNode' is not assignable to type 'import("/Users/rodrigodiasdefigueiredo/Desktop/zerel-parksharing-mobile/node_modules/@types/react-native/node_modules/@types/react/index").ReactNode'.
        Type '{}' is not assignable to type 'ReactNode'.

160               <SwipeButton
                   ~~~~~~~~~~~

src/components/ParkingCheckbox/index.tsx:14:11 - error TS2430: Interface 'RootProps' incorrectly extends interface 'TouchableOpacityProps'.
  Types of property 'children' are incompatible.
    Type 'React.ReactNode' is not assignable to type 'import("/Users/rodrigodiasdefigueiredo/Desktop/zerel-parksharing-mobile/node_modules/@types/react-native/node_modules/@types/react/index").ReactNode'.

14 interface RootProps extends TouchableOpacityProps {
             ~~~~~~~~~

src/components/ParkingCheckbox/index.tsx:29:10 - error TS2786: 'Animated.View' cannot be used as a JSX component.
  Its instance type 'View' is not a valid JSX element.
    The types returned by 'render()' are incompatible between these types.
      Type 'React.ReactNode' is not assignable to type 'import("/Users/rodrigodiasdefigueiredo/Desktop/zerel-parksharing-mobile/node_modules/@types/react-native/node_modules/@types/react/index").ReactNode'.

29         <Animated.View
            ~~~~~~~~~~~~~

src/components/ParkingCheckbox/index.tsx:43:7 - error TS2769: No overload matches this call.
  Overload 1 of 2, '(props: TouchableOpacityProps | Readonly<TouchableOpacityProps>): TouchableOpacity', gave the following error.
    Type 'React.ReactNode' is not assignable to type 'import("/Users/rodrigodiasdefigueiredo/Desktop/zerel-parksharing-mobile/node_modules/@types/react-native/node_modules/@types/react/index").ReactNode'.
  Overload 2 of 2, '(props: TouchableOpacityProps, context: any): TouchableOpacity', gave the following error.
    Type 'React.ReactNode' is not assignable to type 'import("/Users/rodrigodiasdefigueiredo/Desktop/zerel-parksharing-mobile/node_modules/@types/react-native/node_modules/@types/react/index").ReactNode'.

43       {children}
         ~~~~~~~~~~

src/components/Range/index.tsx:71:10 - error TS2786: 'DateTimePickerModal' cannot be used as a JSX component.
  Its instance type 'DateTimePicker' is not a valid JSX element.

71         <DateTimePickerModal
            ~~~~~~~~~~~~~~~~~~~

src/components/WeekDayButton/index.tsx:13:11 - error TS2430: Interface 'RootProps' incorrectly extends interface 'TouchableOpacityProps'.
  Types of property 'children' are incompatible.
    Type 'React.ReactNode' is not assignable to type 'import("/Users/rodrigodiasdefigueiredo/Desktop/zerel-parksharing-mobile/node_modules/@types/react-native/node_modules/@types/react/index").ReactNode'.

13 interface RootProps extends TouchableOpacityProps {
             ~~~~~~~~~

src/components/WeekDayButton/index.tsx:28:10 - error TS2786: 'Animated.View' cannot be used as a JSX component.
  Its instance type 'View' is not a valid JSX element.

28         <Animated.View
            ~~~~~~~~~~~~~

src/components/WeekDayButton/index.tsx:34:11 - error TS2769: No overload matches this call.
  Overload 1 of 2, '(props: AnimateProps<ViewProps> | Readonly<AnimateProps<ViewProps>>): View', gave the following error.
    Type 'ReactNode' is not assignable to type '((string | number | boolean | ReactElement<any, string | JSXElementConstructor<any>> | Iterable<ReactNode> | ReactPortal | AnimatedNode<...>) & (boolean | ... 2 more ... | ReactPortal)) | null | undefined'.
      Type '{}' is not assignable to type '((string | number | boolean | ReactElement<any, string | JSXElementConstructor<any>> | Iterable<ReactNode> | ReactPortal | AnimatedNode<...>) & (boolean | ... 2 more ... | ReactPortal)) | null | undefined'.
  Overload 2 of 2, '(props: AnimateProps<ViewProps>, context: any): View', gave the following error.
    Type 'ReactNode' is not assignable to type '((string | number | boolean | ReactElement<any, string | JSXElementConstructor<any>> | Iterable<ReactNode> | ReactPortal | AnimatedNode<...>) & (boolean | ... 2 more ... | ReactPortal)) | null | undefined'.

34           {children}
             ~~~~~~~~~~

  node_modules/@types/react-native/index.d.ts:2560:5
    2560     children?: React.ReactNode;
             ~~~~~~~~
    The expected type comes from property 'children' which is declared here on type 'IntrinsicAttributes & IntrinsicClassAttributes<View> & Readonly<AnimateProps<ViewProps>> & Readonly<...>'
  node_modules/@types/react-native/index.d.ts:2560:5
    2560     children?: React.ReactNode;
             ~~~~~~~~
    The expected type comes from property 'children' which is declared here on type 'IntrinsicAttributes & IntrinsicClassAttributes<View> & Readonly<AnimateProps<ViewProps>> & Readonly<...>'

src/components/WeekDayButton/index.tsx:41:11 - error TS2769: No overload matches this call.
  Overload 1 of 2, '(props: ViewProps | Readonly<ViewProps>): View', gave the following error.
    Type 'React.ReactNode' is not assignable to type 'import("/Users/rodrigodiasdefigueiredo/Desktop/zerel-parksharing-mobile/node_modules/@types/react-native/node_modules/@types/react/index").ReactNode'.
  Overload 2 of 2, '(props: ViewProps, context: any): View', gave the following error.
    Type 'React.ReactNode' is not assignable to type 'import("/Users/rodrigodiasdefigueiredo/Desktop/zerel-parksharing-mobile/node_modules/@types/react-native/node_modules/@types/react/index").ReactNode'.

41           {children}
             ~~~~~~~~~~

  node_modules/@types/react-native/index.d.ts:2560:5
    2560     children?: React.ReactNode;
             ~~~~~~~~
    The expected type comes from property 'children' which is declared here on type 'IntrinsicAttributes & IntrinsicClassAttributes<View> & Readonly<ViewProps>'
  node_modules/@types/react-native/index.d.ts:2560:5
    2560     children?: React.ReactNode;
             ~~~~~~~~
    The expected type comes from property 'children' which is declared here on type 'IntrinsicAttributes & IntrinsicClassAttributes<View> & Readonly<ViewProps>'

src/routes/app.routes.tsx:120:8 - error TS2786: 'Stack.Navigator' cannot be used as a JSX component.
  Its element type 'ReactElement<any, any> | Component<Omit<DefaultRouterOptions<string> & { id?: string | undefined; children: ReactNode; screenListeners?: Partial<...> | ... 1 more ... | undefined; screenOptions?: StackNavigationOptions | ... 1 more ... | undefined; } & StackRouterOptions & StackNavigationConfig, "id" | ... 3 more .....' is not a valid JSX element.
    Type 'Component<Omit<DefaultRouterOptions<string> & { id?: string | undefined; children: ReactNode; screenListeners?: Partial<{ transitionStart: EventListenerCallback<StackNavigationEventMap, "transitionStart">; ... 7 more ...; beforeRemove: EventListenerCallback<...>; }> | ((props: { ...; }) => Partial<...>) | undefined;...' is not assignable to type 'Element | ElementClass | null'.
      Type 'Component<Omit<DefaultRouterOptions<string> & { id?: string | undefined; children: ReactNode; screenListeners?: Partial<{ transitionStart: EventListenerCallback<StackNavigationEventMap, "transitionStart">; ... 7 more ...; beforeRemove: EventListenerCallback<...>; }> | ((props: { ...; }) => Partial<...>) | undefined;...' is not assignable to type 'ElementClass'.
        The types returned by 'render()' are incompatible between these types.
          Type 'React.ReactNode' is not assignable to type 'import("/Users/rodrigodiasdefigueiredo/Desktop/zerel-parksharing-mobile/node_modules/@types/react-native/node_modules/@types/react/index").ReactNode'.

120       <Stack.Navigator
           ~~~~~~~~~~~~~~~

src/routes/auth.routes.tsx:27:6 - error TS2786: 'Stack.Navigator' cannot be used as a JSX component.
  Its element type 'ReactElement<any, any> | Component<Omit<DefaultRouterOptions<string> & { id?: string | undefined; children: ReactNode; screenListeners?: Partial<...> | ... 1 more ... | undefined; screenOptions?: StackNavigationOptions | ... 1 more ... | undefined; } & StackRouterOptions & StackNavigationConfig, "id" | ... 3 more .....' is not a valid JSX element.

27     <Stack.Navigator
        ~~~~~~~~~~~~~~~

src/screens/FormVehicle/index.tsx:385:17 - error TS2769: No overload matches this call.
  Overload 1 of 2, '(props: TextProps | Readonly<TextProps>): Text', gave the following error.
    Type 'string | FieldError | Merge<FieldError, FieldErrorsImpl<any>> | undefined' is not assignable to type 'ReactNode'.
      Type 'FieldError' is not assignable to type 'ReactNode'.
        Type 'FieldError' is missing the following properties from type 'ReactPortal': key, children, props
  Overload 2 of 2, '(props: TextProps, context: any): Text', gave the following error.
    Type 'string | FieldError | Merge<FieldError, FieldErrorsImpl<any>> | undefined' is not assignable to type 'ReactNode'.

385                 {errors?.color?.message}
                    ~~~~~~~~~~~~~~~~~~~~~~~~

  node_modules/@types/react-native/index.d.ts:1164:5
    1164     children?: React.ReactNode;
             ~~~~~~~~
    The expected type comes from property 'children' which is declared here on type 'IntrinsicAttributes & IntrinsicClassAttributes<Text> & Readonly<TextProps>'
  node_modules/@types/react-native/index.d.ts:1164:5
    1164     children?: React.ReactNode;
             ~~~~~~~~
    The expected type comes from property 'children' which is declared here on type 'IntrinsicAttributes & IntrinsicClassAttributes<Text> & Readonly<TextProps>'

src/screens/FormVehicle/index.tsx:427:17 - error TS2769: No overload matches this call.
  Overload 1 of 2, '(props: TextProps | Readonly<TextProps>): Text', gave the following error.
    Type 'string | FieldError | Merge<FieldError, FieldErrorsImpl<any>> | undefined' is not assignable to type 'ReactNode'.
  Overload 2 of 2, '(props: TextProps, context: any): Text', gave the following error.
    Type 'string | FieldError | Merge<FieldError, FieldErrorsImpl<any>> | undefined' is not assignable to type 'ReactNode'.

427                 {errors?.car_size?.message}
                    ~~~~~~~~~~~~~~~~~~~~~~~~~~~

  node_modules/@types/react-native/index.d.ts:1164:5
    1164     children?: React.ReactNode;
             ~~~~~~~~
    The expected type comes from property 'children' which is declared here on type 'IntrinsicAttributes & IntrinsicClassAttributes<Text> & Readonly<TextProps>'
  node_modules/@types/react-native/index.d.ts:1164:5
    1164     children?: React.ReactNode;
             ~~~~~~~~
    The expected type comes from property 'children' which is declared here on type 'IntrinsicAttributes & IntrinsicClassAttributes<Text> & Readonly<TextProps>'

src/screens/Notifications/HiddenItemWithActions.tsx:33:6 - error TS2786: 'Animated.View' cannot be used as a JSX component.
  Its return type 'ReactNode' is not a valid JSX element.

33     <Animated.View style={[styles.rowBack, { height: rowHeightAnimatedValue }]}>
        ~~~~~~~~~~~~~

src/screens/Notifications/HiddenItemWithActions.tsx:44:10 - error TS2786: 'Animated.View' cannot be used as a JSX component.
  Its return type 'ReactNode' is not a valid JSX element.

44         <Animated.View
            ~~~~~~~~~~~~~

src/screens/Notifications/HiddenItemWithActions.tsx:58:14 - error TS2786: 'Animated.View' cannot be used as a JSX component.
  Its return type 'ReactNode' is not a valid JSX element.

58             <Animated.View
                ~~~~~~~~~~~~~

src/screens/Notifications/VisibleItem.tsx:25:6 - error TS2786: 'Animated.View' cannot be used as a JSX component.
  Its return type 'ReactNode' is not a valid JSX element.
    Type 'undefined' is not assignable to type 'Element | null'.

25     <Animated.View
        ~~~~~~~~~~~~~

src/screens/OnBoarding/index.tsx:80:10 - error TS2786: 'GestureRecognizer' cannot be used as a JSX component.
  Its instance type 'GestureRecognizer' is not a valid JSX element.
    The types returned by 'render()' are incompatible between these types.
      Type 'React.ReactNode' is not assignable to type 'import("/Users/rodrigodiasdefigueiredo/Desktop/zerel-parksharing-mobile/node_modules/@types/react-native/node_modules/@types/react/index").ReactNode'.

80         <GestureRecognizer
            ~~~~~~~~~~~~~~~~~

src/screens/PlaceSearchDetails/index.tsx:108:12 - error TS2786: 'DateTimePickerModal' cannot be used as a JSX component.
  Its instance type 'DateTimePicker' is not a valid JSX element.

108           <DateTimePickerModal
               ~~~~~~~~~~~~~~~~~~~

src/screens/WebPage/index.tsx:47:8 - error TS2786: 'WebView' cannot be used as a JSX component.
  Its instance type 'WebView<{ source: { uri: string; }; style: { flex: number; backgroundColor: string; alignItems: "center"; justifyContent: "center"; }; javaScriptEnabled: true; domStorageEnabled: true; renderLoading: () => Element; startInLoadingState: true; }>' is not a valid JSX element.
    The types returned by 'render()' are incompatible between these types.
      Type 'React.ReactNode' is not assignable to type 'import("/Users/rodrigodiasdefigueiredo/Desktop/zerel-parksharing-mobile/node_modules/@types/react-native/node_modules/@types/react/index").ReactNode'.

47       <WebView
          ~~~~~~~

Found 40 errors in 26 files.

Errors  Files
     1  App.tsx:75
     3  node_modules/react-native-floating-label-input/src/index.tsx:171
     1  src/components/AccordionItem/index.tsx:23
     1  src/components/BackgroundImage/index.tsx:29
     1  src/components/CancelRentModal/index.tsx:136
     2  src/components/CustomButton/index.tsx:5
     3  src/components/CustomCheckBox/index.tsx:14
     1  src/components/Details/index.tsx:717
     1  src/components/Form/ErrorForm/index.tsx:24
     1  src/components/Form/InputForm/index.tsx:47
     2  src/components/FromToDatePicker/index.tsx:71
     1  src/components/GenericHeader/index.tsx:11
     1  src/components/LoadingModal/index.tsx:20
     1  src/components/Monthly/index.tsx:93
     1  src/components/OpenDoorModal/index.tsx:160
     3  src/components/ParkingCheckbox/index.tsx:14
     1  src/components/Range/index.tsx:71
     4  src/components/WeekDayButton/index.tsx:13
     1  src/routes/app.routes.tsx:120
     1  src/routes/auth.routes.tsx:27
     2  src/screens/FormVehicle/index.tsx:385
     3  src/screens/Notifications/HiddenItemWithActions.tsx:33
     1  src/screens/Notifications/VisibleItem.tsx:25
     1  src/screens/OnBoarding/index.tsx:80
     1  src/screens/PlaceSearchDetails/index.tsx:108
     1  src/screens/WebPage/index.tsx:47,

Additional information

if i install all dependencies of the project with yarn and run yarn tsc this is the result:

image

my tsconfig: 

{
  "extends": "@tsconfig/react-native/tsconfig.json",
  "compilerOptions": {
    "target": "esnext",
    "module": "commonjs",
    "lib": ["es6"],
    "rootDir": ".",
    "noImplicitAny": false,
    "allowJs": true,
    "jsx": "react-native",
    "noEmit": true,
    "isolatedModules": true,
    "strict": true,
    "moduleResolution": "node",
    "typeRoots": ["node_modules/@types", "./types"],
    "types": ["jest", "node"],
    "allowSyntheticDefaultImports": true,
    "esModuleInterop": true,
    "skipLibCheck": true
  },
  "exclude": [
    "node_modules",
    "babel.config.js",
    "metro.config.js",
    "delclarations.d.ts",
  ]
}

My eslintrc: 

{
  "env": {
    "es2021": true
  },
  "extends": [
    "airbnb",
    "airbnb/hooks",
    "airbnb-typescript",
    "plugin:@typescript-eslint/recommended",
    "plugin:react/recommended",
    "plugin:import/errors",
    "plugin:import/warnings",
    "plugin:import/typescript",
    "prettier"
  ],
  "globals": {
    "__DEV__": "readonly"
  },
  "parser": "@typescript-eslint/parser",
  "parserOptions": {
    "ecmaFeatures": {
      "jsx": true
    },
    "ecmaVersion": 12,
    "sourceType": "module",
    "project": "./tsconfig.json"
  },
  "plugins": [
    "react",
    "react-hooks",
    "@typescript-eslint",
    "prettier"
  ],
  "rules": {
    "no-console": "off",
    "object-shorthand": 0,
    "consistent-return": "off",
    "react/jsx-props-no-spreading": "off",
    "import/prefer-default-export": "off",
    "react/prop-types": "off",
    "react/require-default-props": "off",
    "@typescript-eslint/dot-notation": "off",
    "@typescript-eslint/naming-convention": "off",
    "react-hooks/rules-of-hooks": "error",
    "react-hooks/exhaustive-deps": "off",
    "react/jsx-filename-extension": [
      1,
      {
        "extensions": [
          ".tsx"
        ]
      }
    ],
    "import/extensions": [
      "error",
      "ignorePackages",
      {
        "js": "never",
        "jsx": "never",
        "ts": "never",
        "tsx": "never"
      }
    ],
    "no-use-before-define": "off",
    "@typescript-eslint/no-use-before-define": [
      "error"
    ],
    "react/react-in-jsx-scope": "off",
    "prettier/prettier": "error"
  },
  "settings": {
    "import/resolver": {
      "node": {
        "extensions": [".ts", ".tsx"],
        "moduleDirectory": ["src", "node_modules"]
      }
    }
  }
}

my eslint.ignore: 

/*.js
**/*.js
/**/node_modules/*
client/dist/
build
android
ios

my package.json

{
  "name": "zerelparksharing",
  "version": "0.1",
  "private": true,
  "scripts": {
    "android": "react-native run-android",
    "ios": "react-native run-ios --simulator \"IphoneX\"",
    "start": "react-native start",
    "device": "react-native run-android --variant=release",
    "lint": "eslint --ext .tsx --ext .ts src/",
    "typecheck": "tsc --project tsconfig.json --noEmit",
    "clean-project": "react-native-clean-project",
    "clean-android": "cd android && ./gradlew --stop && ./gradlew clean",
    "bundle": "cd android && ./gradlew bundleRelease",
    "build-apk": "cd android && ./gradlew assembleRelease",
    "install-apk": "adb install app-release.apk",
    "pod": "cd ios && pod install && cd ..",
    "test": "jest --passWithNoTests --no-cache --runInBand",
    "test:watch": "jest --watch",
    "clear_jest": "jest --clearCache",
    "clear-branches": "git branch | grep -v \"dev\" | xargs git branch -D && git fetch --prune"
  },
  "dependencies": {
    "@aws-amplify/api": "^5.4.4",
    "@gorhom/bottom-sheet": "^4.5.1",
    "@hookform/resolvers": "^2.9.10",
    "@notifee/react-native": "^7.8.0",
    "@react-native-async-storage/async-storage": "^1.17.11",
    "@react-native-community/datetimepicker": "^7.6.0",
    "@react-native-community/netinfo": "^9.3.7",
    "@react-native-firebase/app": "^14.11.0",
    "@react-native-firebase/messaging": "^14.11.0",
    "@react-native-masked-view/masked-view": "0.2.8",
    "@react-navigation/native": "^6.0.13",
    "@react-navigation/native-stack": "^6.9.1",
    "@react-navigation/stack": "^6.3.4",
    "@shopify/flash-list": "^1.4.2",
    "aws-amplify": "^5.0.14",
    "clsx": "^1.2.1",
    "date-fns": "^2.29.3",
    "lottie-react-native": "^5.1.6",
    "nativewind": "^2.0.11",
    "phosphor-react-native": "^1.1.2",
    "react": "18.1.0",
    "react-hook-form": "^7.39.4",
    "react-native": "0.70.6",
    "react-native-actions-sheet": "^0.8.29",
    "react-native-background-fetch": "4.1.5",
    "react-native-background-geolocation": "4.10.1",
    "react-native-biometrics": "^3.0.1",
    "react-native-confirmation-code-field": "^7.3.1",
    "react-native-contacts": "^7.0.5",
    "react-native-device-info": "^10.4.0",
    "react-native-dotenv": "^3.4.9",
    "react-native-dropdown-picker": "^5.4.6",
    "react-native-flash-message": "^0.4.2",
    "react-native-floating-label-input": "^1.4.2",
    "react-native-gesture-handler": "^2.9.0",
    "react-native-google-places-autocomplete": "^2.5.1",
    "react-native-image-crop-picker": "^0.37.3",
    "react-native-iphone-x-helper": "^1.3.1",
    "react-native-maps": "^1.7.1",
    "react-native-modal-datetime-picker": "^17.1.0",
    "react-native-open-maps": "^0.4.0",
    "react-native-permissions": "^3.6.1",
    "react-native-phone-number-input": "^2.1.0",
    "react-native-ratings": "^8.1.0",
    "react-native-reanimated": "^2.14.4",
    "react-native-responsive-screen": "^1.4.2",
    "react-native-safe-area-context": "4.4.1",
    "react-native-screens": "~3.18.0",
    "react-native-splash-screen": "^3.3.0",
    "react-native-svg": "^13.9.0",
    "react-native-svg-transformer": "^1.0.0",
    "react-native-swipe-gestures": "^1.0.5",
    "react-native-swipe-list-view": "^3.2.9",
    "react-native-tooltip-2": "^0.1.3",
    "react-native-version-check": "^3.4.7",
    "react-native-webview": "^13.2.3",
    "redux-persist": "^6.0.0",
    "rn-swipe-button": "^1.3.8",
    "tailwindcss": "3.3.2",
    "yup": "^0.32.11",
    "zustand": "^4.3.6"
  },
  "devDependencies": {
    "@babel/core": "^7.12.9",
    "@babel/runtime": "^7.12.5",
    "@testing-library/jest-native": "^5.4.1",
    "@testing-library/react-native": "^11.5.1",
    "@tsconfig/react-native": "^2.0.2",
    "@types/jest": "^29.4.0",
    "@types/react": "^17.0.43",
    "@types/react-native": "^0.70.11",
    "@types/react-native-dotenv": "^0.2.0",
    "@types/react-native-version-check": "^3.4.5",
    "@types/react-test-renderer": "^18.0.0",
    "@typescript-eslint/eslint-plugin": "^6.4.0",
    "babel-plugin-module-resolver": "^5.0.0",
    "eslint": "^8.0.1",
    "eslint-config-airbnb": "^19.0.4",
    "eslint-config-airbnb-typescript": "^17.1.0",
    "eslint-config-prettier": "^9.0.0",
    "eslint-config-standard-with-typescript": "^39.0.0",
    "eslint-import-resolver-babel-module": "^5.3.2",
    "eslint-plugin-import": "^2.28.1",
    "eslint-plugin-jsx-a11y": "^6.7.1",
    "eslint-plugin-n": "^15.0.0 || ^16.0.0 ",
    "eslint-plugin-prettier": "^5.0.0",
    "eslint-plugin-promise": "^6.0.0",
    "eslint-plugin-react": "^7.33.2",
    "eslint-plugin-react-hooks": "^4.6.0",
    "eslint-plugin-react-native": "^4.0.0",
    "jest": "^29.6.4",
    "jest-transform-stub": "^2.0.0",
    "metro-react-native-babel-preset": "0.72.3",
    "prettier": "^3.0.3",
    "react-native-clean-project": "^4.0.1",
    "react-test-renderer": "^18.2.0",
    "typescript": "*"
  },
  "resolutions": {
    "@types/react": "17.0.43",
    "@types/react-native": "~0.70.6"
  }
}
colinhacks commented 9 months ago

You might have multiple copies of @types/react in your node_modules. This can be tricky to reproduce or resolve.

Try deleting node_modules and bun.lockb and re-installing. That will force all dependencies to be re-resolved and sometimes solve the duplication problem.

If that doesn't work try removing @types/react from devDependencies and re-installing everything - @types/react-native already has it as a dependency.

rodrigodiasf1984 commented 9 months ago

@types/react-native

Thanks for you're help!

I've tried what you suggest but now I'm getting other errors :

`zerel-parksharing-mobile on ξ‚  dev [!] via β¬’ v18.16.1 via 🍞 v1.0.2 via πŸ’Ž ruby-2.7.5 ➜ bun tsc src/components/CustomBottomSheet/index.tsx:119:7 - error TS2769: No overload matches this call. Overload 1 of 2, '(props: ViewProps | Readonly): View', gave the following error. Type '{ position: "absolute"; width: "100%"; bottom: number; height: string; zIndex: number | undefined; }' is not assignable to type 'StyleProp'. Types of property 'height' are incompatible. Type 'string' is not assignable to type 'DimensionValue | undefined'. Overload 2 of 2, '(props: ViewProps, context: any): View', gave the following error. Type '{ position: "absolute"; width: "100%"; bottom: number; height: string; zIndex: number | undefined; }' is not assignable to type 'StyleProp'. Types of property 'height' are incompatible. Type 'string' is not assignable to type 'DimensionValue | undefined'.

119 style={{


  node_modules/@types/react-native/Libraries/Components/View/ViewPropTypes.d.ts:219:5
    219     style?: StyleProp<ViewStyle> | undefined;
The expected type comes from property 'style' which is declared here on type 'IntrinsicAttributes & IntrinsicClassAttributes<View> & Readonly<ViewProps>'

node_modules/@types/react-native/Libraries/Components/View/ViewPropTypes.d.ts:219:5 219 style?: StyleProp | undefined;

    The expected type comes from property 'style' which is declared here on type 'IntrinsicAttributes & IntrinsicClassAttributes<View> & Readonly<ViewProps>'

src/components/MapModal/index.tsx:106:9 - error TS2769: No overload matches this call.
  Overload 1 of 2, '(props: TouchableOpacityProps | Readonly<TouchableOpacityProps>): TouchableOpacity', gave the following error.
    Type '{ top: string; right: string; }' is not assignable to type 'StyleProp<ViewStyle>'.
      Types of property 'top' are incompatible.
        Type 'string' is not assignable to type 'DimensionValue | undefined'.
  Overload 2 of 2, '(props: TouchableOpacityProps, context: any): TouchableOpacity', gave the following error.
    Type '{ top: string; right: string; }' is not assignable to type 'StyleProp<ViewStyle>'.
      Types of property 'top' are incompatible.
        Type 'string' is not assignable to type 'DimensionValue | undefined'.

106         style={{

node_modules/@types/react-native/Libraries/Components/Touchable/TouchableWithoutFeedback.d.ts:104:5 104 style?: StyleProp | undefined;

    The expected type comes from property 'style' which is declared here on type 'IntrinsicAttributes & IntrinsicClassAttributes<TouchableOpacity> & Readonly<TouchableOpacityProps>'
  node_modules/@types/react-native/Libraries/Components/Touchable/TouchableWithoutFeedback.d.ts:104:5
    104     style?: StyleProp<ViewStyle> | undefined;
The expected type comes from property 'style' which is declared here on type 'IntrinsicAttributes & IntrinsicClassAttributes<TouchableOpacity> & Readonly<TouchableOpacityProps>'

src/components/RangeProgressBar/index.tsx:66:19 - error TS2769: No overload matches this call. Overload 1 of 2, '(props: ViewProps | Readonly): View', gave the following error. Type '{ position: "absolute"; width: string; left: string; height: number; }' is not assignable to type 'StyleProp'. Types of property 'width' are incompatible. Type 'string' is not assignable to type 'DimensionValue | undefined'. Overload 2 of 2, '(props: ViewProps, context: any): View', gave the following error. Type '{ position: "absolute"; width: string; left: string; height: number; }' is not assignable to type 'StyleProp'. Types of property 'width' are incompatible. Type 'string' is not assignable to type 'DimensionValue | undefined'.

66 style={{


  node_modules/@types/react-native/Libraries/Components/View/ViewPropTypes.d.ts:219:5
    219     style?: StyleProp<ViewStyle> | undefined;
The expected type comes from property 'style' which is declared here on type 'IntrinsicAttributes & IntrinsicClassAttributes<View> & Readonly<ViewProps>'

node_modules/@types/react-native/Libraries/Components/View/ViewPropTypes.d.ts:219:5 219 style?: StyleProp | undefined;

    The expected type comes from property 'style' which is declared here on type 'IntrinsicAttributes & IntrinsicClassAttributes<View> & Readonly<ViewProps>'

src/screens/FormVehicle/index.tsx:385:17 - error TS2769: No overload matches this call.
  Overload 1 of 2, '(props: TextProps | Readonly<TextProps>): Text', gave the following error.
    Type 'string | FieldError | Merge<FieldError, FieldErrorsImpl<any>> | undefined' is not assignable to type 'ReactNode'.
      Type 'FieldError' is not assignable to type 'ReactNode'.
        Type 'FieldError' is missing the following properties from type 'ReactPortal': key, children, props
  Overload 2 of 2, '(props: TextProps, context: any): Text', gave the following error.
    Type 'string | FieldError | Merge<FieldError, FieldErrorsImpl<any>> | undefined' is not assignable to type 'ReactNode'.

385                 {errors?.color?.message}

node_modules/@types/react-native/Libraries/Text/Text.d.ts:108:5 108 children?: React.ReactNode | undefined;

    The expected type comes from property 'children' which is declared here on type 'IntrinsicAttributes & IntrinsicClassAttributes<Text> & Readonly<TextProps>'
  node_modules/@types/react-native/Libraries/Text/Text.d.ts:108:5
    108     children?: React.ReactNode | undefined;
The expected type comes from property 'children' which is declared here on type 'IntrinsicAttributes & IntrinsicClassAttributes<Text> & Readonly<TextProps>'

src/screens/FormVehicle/index.tsx:427:17 - error TS2769: No overload matches this call. Overload 1 of 2, '(props: TextProps | Readonly): Text', gave the following error. Type 'string | FieldError | Merge<FieldError, FieldErrorsImpl> | undefined' is not assignable to type 'ReactNode'. Overload 2 of 2, '(props: TextProps, context: any): Text', gave the following error. Type 'string | FieldError | Merge<FieldError, FieldErrorsImpl> | undefined' is not assignable to type 'ReactNode'.

427 {errors?.car_size?.message}


  node_modules/@types/react-native/Libraries/Text/Text.d.ts:108:5
    108     children?: React.ReactNode | undefined;
The expected type comes from property 'children' which is declared here on type 'IntrinsicAttributes & IntrinsicClassAttributes<Text> & Readonly<TextProps>'

node_modules/@types/react-native/Libraries/Text/Text.d.ts:108:5 108 children?: React.ReactNode | undefined;

    The expected type comes from property 'children' which is declared here on type 'IntrinsicAttributes & IntrinsicClassAttributes<Text> & Readonly<TextProps>'

src/screens/Home/index.tsx:469:9 - error TS2769: No overload matches this call.
  Overload 1 of 2, '(props: TouchableOpacityProps | Readonly<TouchableOpacityProps>): TouchableOpacity', gave the following error.
    Type '{ top: string; }' is not assignable to type 'StyleProp<ViewStyle>'.
      Types of property 'top' are incompatible.
        Type 'string' is not assignable to type 'DimensionValue | undefined'.
  Overload 2 of 2, '(props: TouchableOpacityProps, context: any): TouchableOpacity', gave the following error.
    Type '{ top: string; }' is not assignable to type 'StyleProp<ViewStyle>'.
      Types of property 'top' are incompatible.
        Type 'string' is not assignable to type 'DimensionValue | undefined'.

469         style={{

node_modules/@types/react-native/Libraries/Components/Touchable/TouchableWithoutFeedback.d.ts:104:5 104 style?: StyleProp | undefined;

    The expected type comes from property 'style' which is declared here on type 'IntrinsicAttributes & IntrinsicClassAttributes<TouchableOpacity> & Readonly<TouchableOpacityProps>'
  node_modules/@types/react-native/Libraries/Components/Touchable/TouchableWithoutFeedback.d.ts:104:5
    104     style?: StyleProp<ViewStyle> | undefined;
The expected type comes from property 'style' which is declared here on type 'IntrinsicAttributes & IntrinsicClassAttributes<TouchableOpacity> & Readonly<TouchableOpacityProps>'

Found 6 errors in 5 files.

Errors Files 1 src/components/CustomBottomSheet/index.tsx:119 1 src/components/MapModal/index.tsx:106 1 src/components/RangeProgressBar/index.tsx:66 2 src/screens/FormVehicle/index.tsx:385 1 src/screens/Home/index.tsx:469

zerel-parksharing-mobile on ξ‚  dev [!] via β¬’ v18.16.1 via 🍞 v1.0.2 via πŸ’Ž ruby-2.7.5 took 11.5s ➜`

This is my package.json updated: { "name": "zerelparksharing", "version": "0.1", "private": true, "scripts": { "android": "react-native run-android", "ios": "react-native run-ios --simulator \"IphoneX\"", "start": "react-native start", "device": "react-native run-android --variant=release", "lint": "eslint --ext .tsx --ext .ts src/", "typecheck": "tsc --project tsconfig.json --noEmit", "clean-project": "react-native-clean-project", "clean-android": "cd android && ./gradlew --stop && ./gradlew clean", "bundle": "cd android && ./gradlew bundleRelease", "build-apk": "cd android && ./gradlew assembleRelease", "install-apk": "adb install app-release.apk", "pod": "cd ios && pod install && cd ..", "test": "jest --passWithNoTests --no-cache --runInBand", "test:watch": "jest --watch", "clear_jest": "jest --clearCache", "clear-branches": "git branch | grep -v \"dev\" | xargs git branch -D && git fetch --prune" }, "dependencies": { "@aws-amplify/api": "^5.4.4", "@gorhom/bottom-sheet": "^4.5.1", "@hookform/resolvers": "^2.9.10", "@notifee/react-native": "^7.8.0", "@react-native-async-storage/async-storage": "^1.17.11", "@react-native-community/datetimepicker": "^7.6.0", "@react-native-community/netinfo": "^9.3.7", "@react-native-firebase/app": "^14.11.0", "@react-native-firebase/messaging": "^14.11.0", "@react-native-masked-view/masked-view": "0.2.8", "@react-navigation/native": "^6.0.13", "@react-navigation/native-stack": "^6.9.1", "@react-navigation/stack": "^6.3.4", "@shopify/flash-list": "^1.4.2", "aws-amplify": "^5.0.14", "clsx": "^1.2.1", "date-fns": "^2.29.3", "lottie-react-native": "^5.1.6", "nativewind": "^2.0.11", "phosphor-react-native": "^1.1.2", "react": "18.1.0", "react-hook-form": "^7.39.4", "react-native": "0.70.6", "react-native-actions-sheet": "^0.8.29", "react-native-background-fetch": "4.1.5", "react-native-background-geolocation": "4.10.1", "react-native-biometrics": "^3.0.1", "react-native-confirmation-code-field": "^7.3.1", "react-native-contacts": "^7.0.5", "react-native-device-info": "^10.4.0", "react-native-dotenv": "^3.4.9", "react-native-dropdown-picker": "^5.4.6", "react-native-flash-message": "^0.4.2", "react-native-floating-label-input": "^1.4.2", "react-native-gesture-handler": "^2.9.0", "react-native-google-places-autocomplete": "^2.5.1", "react-native-image-crop-picker": "^0.37.3", "react-native-iphone-x-helper": "^1.3.1", "react-native-maps": "^1.7.1", "react-native-modal-datetime-picker": "^17.1.0", "react-native-open-maps": "^0.4.0", "react-native-permissions": "^3.6.1", "react-native-phone-number-input": "^2.1.0", "react-native-ratings": "^8.1.0", "react-native-reanimated": "^2.14.4", "react-native-responsive-screen": "^1.4.2", "react-native-safe-area-context": "4.4.1", "react-native-screens": "~3.18.0", "react-native-splash-screen": "^3.3.0", "react-native-svg": "^13.9.0", "react-native-svg-transformer": "^1.0.0", "react-native-swipe-gestures": "^1.0.5", "react-native-swipe-list-view": "^3.2.9", "react-native-tooltip-2": "^0.1.3", "react-native-version-check": "^3.4.7", "react-native-webview": "^13.2.3", "redux-persist": "^6.0.0", "rn-swipe-button": "^1.3.8", "tailwindcss": "3.3.2", "yup": "^0.32.11", "zustand": "^4.3.6" }, "devDependencies": { "@babel/core": "^7.12.9", "@babel/runtime": "^7.12.5", "@testing-library/jest-native": "^5.4.1", "@testing-library/react-native": "^11.5.1", "@tsconfig/react-native": "^2.0.2", "@types/jest": "^29.4.0", "@types/react-native": "^0.72.3", "@types/react-native-dotenv": "^0.2.0", "@types/react-native-version-check": "^3.4.5", "@types/react-test-renderer": "^18.0.0", "@typescript-eslint/eslint-plugin": "^6.4.0", "babel-plugin-module-resolver": "^5.0.0", "eslint": "^8.0.1", "eslint-config-airbnb": "^19.0.4", "eslint-config-airbnb-typescript": "^17.1.0", "eslint-config-prettier": "^9.0.0", "eslint-config-standard-with-typescript": "^39.0.0", "eslint-import-resolver-babel-module": "^5.3.2", "eslint-plugin-import": "^2.28.1", "eslint-plugin-jsx-a11y": "^6.7.1", "eslint-plugin-n": "^15.0.0 || ^16.0.0 ", "eslint-plugin-prettier": "^5.0.0", "eslint-plugin-promise": "^6.0.0", "eslint-plugin-react": "^7.33.2", "eslint-plugin-react-hooks": "^4.6.0", "eslint-plugin-react-native": "^4.0.0", "jest": "^29.6.4", "jest-transform-stub": "^2.0.0", "metro-react-native-babel-preset": "0.72.3", "prettier": "^3.0.3", "react-native-clean-project": "^4.0.1", "react-test-renderer": "^18.2.0", "typescript": "*" }, "resolutions": { "@types/react-native": "0.72.3" } }

any idea how to solve it?

rosszurowski commented 9 months ago

I've ran into this too. I think it's due to multiple copies of @types/react being installed. On other projects where I've run into this, the fix is to use yarn's resolutions field or npm's overrides to force resolve a single version. However, Bun doesn't yet support this (see https://github.com/oven-sh/bun/issues/1134).

rodrigodiasf1984 commented 9 months ago

I've ran into this too. I think it's due to multiple copies of @types/react being installed. On other projects where I've run into this, the fix is to use yarn's resolutions field or npm's overrides to force resolve a single version. However, Bun doesn't yet support this (see #1134).

Thanks for your comment, I'll follow the other issues.

luisrudge commented 7 months ago

I'm still seeing the same thing even if I use overrides/resolutions :(

dominictobias commented 3 months ago

Edit: mine was quite niche I guess. I didn't have dupes or diff versions but I did have a separate bun project at src/api and that uses bun JSX on server (so maybe some React conflicts). So I had to add "exclude": ["src/api"],. I will prob just move it outside source as a cleaner solution.

Edit edit: bit of a catch-22 since I want to import App from Elysia on the api for the Eden UI client to have strong typing, as soon as I do that, even a very strict path like paths: { "@api/index": ["api/src/index"] } it breaks again. But I don't think this is a bun specific issue.