types.d.ts doesn't type-check against React Native 0.88: Touchable, ScrollViewProps and VirtualizedListProps

Abierto Apto para principiantes
  • ¿Algo no está bien?
#548 2 comentarios 0 reacciones 0 asignados Ver en GitHub

Los mantenedores suelen responder en 12 días

Nadie ha tomado este issue todavía.

Evaluación

Dificultad
2/5
Tiempo estimado
1-3 horas
Aptitud para principiantes
72/100
Tipo de issue
Error
Claridad
Bien especificado
Estado de actividad
Activo
Stack tecnológico
react-native, typescript
Área
mobile-dev

Línea de trabajo

Empieza desde types.d.ts (líneas 1-30) donde Touchable, ScrollViewProps y VirtualizedListProps están augmented. Comprueba los tipos de React Native 0.88 para ver exports/generics eliminados, luego corrige las cláusulas extends. Hecho cuando npx tsc en el repro repo no reporta errores de react-native-css/types.d.ts.

Escrito por el modelo de indexación a partir del texto del issue.

Descripción

Before submitting a new issue
  • I tested using the latest version of the library, as the bug might be already fixed.
  • I tested using a supported version of react native.
  • I checked for possible duplicate issues, with possible answers.
Bug summary

react-native-css/types (the reference nativewind-env.d.ts adds) augments react-native with names and extends clauses that React Native 0.88's generated types no longer have, so a project that checks declarations (skipLibCheck: false) gets errors from it (types.d.ts at 2421ea7):

  • Touchable is no longer exported by react-native.
  • interface ScrollViewProps extends ViewProps, ScrollViewPropsIOS, ScrollViewPropsAndroid, Touchable clashes with 0.88's own ScrollViewProps, and the className the file adds to ViewProps and ImagePropsBase makes ScrollViewProps, ImageBackgroundProps and KeyboardAvoidingViewProps unable to extend both of their bases.
  • VirtualizedListProps is no longer generic, so FlatListProps<ItemT> extends VirtualizedListProps<ItemT> fails.
Library version

0.0.0-nightly.2421ea7 (main at 2421ea77da52), and 3.1.0-rc.0

Environment info
Windows 11 10.0.26300, Node 26.12.1, npm 12.2.1, TypeScript 7.0.2, react-native 0.88.1, react 19.3.1, @types/react 19.3.0.
No app or native build is involved: the errors come from the type check alone.
Steps to reproduce
  1. Clone the reproducible example: a package.json with react-native 0.88.1 and react-native-css 0.0.0-nightly.2421ea7, a tsconfig.json with strict and skipLibCheck: false, and an index.ts holding only import type {} from 'react-native-css/types';.
  2. npm install --ignore-scripts
  3. npx tsc -p .

Expected: no error from react-native-css/types.d.ts.

Actual, among the output (the run also prints a few errors of React Native's own declarations, which are separate):

node_modules/react-native-css/types.d.ts(6,3): error TS2305: Module '"react-native"' has no exported member 'Touchable'.
node_modules/react-native-css/types.d.ts(22,13): error TS2320: Interface 'ScrollViewProps' cannot simultaneously extend types 'Readonly<Omit<Omit<ViewProps, "experimental_accessibilityOrder">, "StickyHeaderComponent" | "alwaysBounceHorizontal" | "alwaysBounceVertical" | "automaticallyAdjustContentInsets" | ... 62 more ... | "zoomScale"> & Omit<...> & Omit<...> & Omit<...>>' and 'ViewProps'.
node_modules/react-native-css/types.d.ts(29,42): error TS2315: Type 'VirtualizedListProps' is not generic.
node_modules/react-native/types_generated/Libraries/Components/Keyboard/KeyboardAvoidingView.d.ts(40,18): error TS2320: Interface 'KeyboardAvoidingViewProps' cannot simultaneously extend types ...
  Named property 'className' of types ...
node_modules/react-native/types_generated/Libraries/Image/ImageProps.d.ts(291,18): error TS2320: Interface 'ImageBackgroundProps' cannot simultaneously extend types ...
  Named property 'className' of types ...
Reproducible example repository

https://github.com/YevheniiKotyrlo/react-native-css-types-react-native-0-88

Lenguaje dominante
TypeScript
Estrellas
166
Forks
45
Merge medio
17 d 22 h
PR fusionados (30 d)
3

Preparar el entorno

Primeros pasos

  1. Lee el issue completo y luego la guía de contribución del proyecto.
  2. Comenta en el issue que vas a ocuparte — evita que dos personas hagan lo mismo.
  3. Haz un fork del repositorio y trabaja en una rama.
  4. Abre un pull request que haga referencia al número del issue.

Más de nativewind/react-native-css

Todos los issues de nativewind/react-native-css

Issues similares

Más issues de TypeScript

Recibe los nuevos issues en tu correo

Un resumen breve de issues de GitHub para principiantes.