Strict TypeScript API (opcjonalne)

Nieoficjalne Tłumaczenie Beta

Ta strona została przetłumaczona przez PageTurner AI (beta). Nie jest oficjalnie zatwierdzona przez projekt. Znalazłeś błąd? Zgłoś problem →

Strict TypeScript API to podgląd przyszłego, stabilnego interfejsu JavaScriptowego dla React Native.

Dokładniej mówiąc, to nowy zestaw typów TypeScript dla pakietu npm react-native, dostępny od wersji 0.80. Zapewniają one silniejszą i bardziej przyszłościową dokładność typów, co pozwoli nam pewnie rozwijać API React Native w stabilną formę. Dołączenie do Strict TypeScript API wprowadza pewne różnice strukturalne w typach, dlatego jest to jednorazowa zmiana łamiąca kompatybilność.

Nowe typy charakteryzują się:

1. Generowaniem bezpośrednio z kodu źródłowego — zwiększa to pokrycie i poprawność, dzięki czemu możesz oczekiwać silniejszych gwarancji kompatybilności.

2. Ograniczeniem do pliku indeksowego react-native — ściślej definiuje nasze publiczne API, co oznacza że nie złamiemy API przy zmianach wewnętrznych plików.

Gdy społeczność będzie gotowa, Strict TypeScript API stanie się domyślnym interfejsem w przyszłości — zsynchronizowanym z usuwaniem głębokich importów.

Dołączanie

Dostarczamy nowe typy równolegle z istniejącymi, co oznacza że możesz migrować w dogodnym momencie. Zachęcamy pionierów i nowo tworzone aplikacje do dołączenia poprzez plik tsconfig.json.

Dołączenie jest zmianą łamiącą kompatybilność, ponieważ niektóre nowe typy mają zaktualizowane nazwy i struktury, choć wiele aplikacji nie odczuje skutków. Szczegóły każdej zmiany znajdziesz w następnej sekcji.

tsconfig.json

{
  "extends": "@react-native/typescript-config",
  "compilerOptions": {
    ...
    "customConditions": ["react-native-strict-api"]
  }
}

Działanie w tle

To ustawienie nakazuje TypeScriptowi rozwiązywanie typów react-native z nowego katalogu types_generated/ zamiast poprzedniego types/ (utrzymywanego ręcznie). Restart TypeScripta lub edytora nie jest wymagany.

Strict TypeScript API realizuje nasze RFC dotyczące usuwania głębokich importów z React Native. W efekcie niektóre API nie są już eksportowane w głównym zakresie. To celowe działanie mające na celu zmniejszenie powierzchni API React Native.

Opinia o API

Przesyłanie opinii: Będziemy współpracować ze społecznością, aby ustalić które API eksportować przez (co najmniej) następne dwie wersje React Native. Podziel się swoją opinią w naszym wątku dyskusyjnym.

Więcej informacji o motywacji i harmonogramie znajdziesz w ogłoszeniu na blogu.

Przewodnik migracji

Typy generujące powinny być importowane z pakietu react-native

Typy używane przy generowaniu kodu, takie jak Int32, Double, WithDefault itp., są teraz dostępne w pojedynczej przestrzeni nazw CodegenTypes. Podobnie, codegenNativeComponent i codegenNativeCommands można teraz importować bezpośrednio z pakietu react-native zamiast używać głębokich importów.

Przestrzenie nazw CodegenTypes oraz codegenNativeCommands i codegenNativeComponent są również dostępne z pakietu react-native gdy Strict API nie jest włączone, co ułatwia adaptację bibliotekom stron trzecich.

Przed

import codegenNativeComponent from 'react-native/Libraries/Utilities/codegenNativeComponent';
import type {
  Int32,
  WithDefault,
} from 'react-native/Libraries/Types/CodegenTypes';

interface NativeProps extends ViewProps {
  enabled?: WithDefault<boolean, true>;
  size?: Int32;
}

export default codegenNativeComponent<NativeProps>(
  'RNCustomComponent',
);

Po

import {CodegenTypes, codegenNativeComponent} from 'react-native';

interface NativeProps extends ViewProps {
  enabled?: CodegenTypes.WithDefault<boolean, true>;
  size?: CodegenTypes.Int32;
}

export default codegenNativeComponent<NativeProps>(
  'RNCustomComponent',
);

Usunięcie typów *Static

Przed

import {Linking, LinkingStatic} from 'react-native';

function foo(linking: LinkingStatic) {}
foo(Linking);

Po

import {Linking} from 'react-native';

function foo(linking: Linking) {}
foo(Linking);

Następujące API były wcześniej nazywane *Static z deklaracją zmiennej odpowiadającego typu. W większości przypadków istniał alias eksportujący wartość i typ pod tą samą nazwą, ale niektóre brakowały.

(Na przykład istniał typ AlertStatic, zmienna Alert typu AlertStatic oraz alias typu Alert dla AlertStatic. W przypadku PixelRatio istniał typ PixelRatioStatic i zmienna PixelRatio tego typu bez dodatkowych aliasów typów.)

Dotknięte interfejsy API

• AlertStatic

• ActionSheetIOSStatic

• ToastAndroidStatic

• InteractionManagerStatic (Brak istotnego aliasu typu InteractionManager)

• UIManagerStatic

• PlatformStatic

• SectionListStatic

• PixelRatioStatic (Brak istotnego aliasu typu PixelRatio)

• AppStateStatic

• AccessibilityInfoStatic

• ImageResizeModeStatic

• BackHandlerStatic

• DevMenuStatic (Brak istotnego aliasu typu DevMenu)

• ClipboardStatic

• PermissionsAndroidStatic

• ShareStatic

• DeviceEventEmitterStatic

• LayoutAnimationStatic

• KeyboardStatic (Brak istotnego aliasu typu Keyboard)

• DevSettingsStatic (Brak istotnego aliasu typu DevSettings)

• I18nManagerStatic

• EasingStatic

• PanResponderStatic

• NativeModulesStatic (Brak istotnego aliasu typu NativeModules)

• LogBoxStatic

• PushNotificationIOSStatic

• SettingsStatic

• VibrationStatic

Niektóre główne komponenty są teraz komponentami funkcyjnymi zamiast klasowych

• View

• Image

• TextInput

• Modal

• Text

• TouchableWithoutFeedback

• Switch

• ActivityIndicator

• ProgressBarAndroid

• InputAccessoryView

• Button

• SafeAreaView

W wyniku tej zmiany, dostęp do typów referencji tych widoków wymaga użycia wzorca React.ComponentRef<typeof View>, który działa zgodnie z oczekiwaniami zarówno dla komponentów klasowych, jak i funkcyjnych, np.:

const ref = useRef<React.ComponentRef<typeof View>>(null);

Inne zmiany łamiące kompatybilność

Zmiany w typach Animated

Węzły Animated były wcześniej typami generycznymi opartymi na ich wynikowej interpolacji. Teraz są to typy niegeneryczne z generyczną metodą interpolate.

Animated.LegacyRef nie jest już dostępny.

Ujednolicone typy dla opcjonalnych właściwości

W nowych typach każda opcjonalna właściwość będzie typowana jako type | undefined.

Usunięcie niektórych przestarzałych typów

All types listed in DeprecatedPropertiesAlias.d.ts are inaccessible under the Strict API.

Usunięcie pozostałych właściwości komponentów

Niektóre właściwości zdefiniowane w typach, które nie były używane przez komponent lub nie miały pełnej definicji, zostały usunięte (np. lineBreakMode w Text, scrollWithoutAnimationTo w ScrollView, style transform zdefiniowane poza tablicą transform).

Wcześniej dostępne prywatne typy pomocnicze mogą zostać usunięte

Ze względu na konfigurację poprzednich definicji typów, każdy zdefiniowany typ był dostępny z pakietu react-native. Obejmowało to typy niejawnie eksportowane oraz typy pomocnicze przeznaczone wyłącznie do użytku wewnętrznego.

Znaczące przykłady to typy związane z StyleSheet (jak RecursiveArray, RegisteredStyle i Falsy) oraz Animated (np. WithAnimatedArray i WithAnimatedObject).