Pierwszorzędne wsparcie dla TypeScript
Ta strona została przetłumaczona przez PageTurner AI (beta). Nie jest oficjalnie zatwierdzona przez projekt. Znalazłeś błąd? Zgłoś problem →
Wraz z wydaniem wersji 0.71, React Native inwestuje w doświadczenie pracy z TypeScript poprzez następujące zmiany:
W tym poście omówimy, co te zmiany oznaczają dla użytkowników TypeScript i Flow.
Nowy szablon aplikacji domyślnie używa TypeScript
Począwszy od wersji 0.71, gdy tworzysz nową aplikację React Native za pomocą CLI React Native, domyślnie otrzymasz aplikację w TypeScript!
npx react-native init My71App --version 0.71.0
Punktem startowym nowo generowanej aplikacji będzie App.tsx zamiast App.js - w pełni typowany TypeScript. Nowy projekt jest już skonfigurowany z tsconfig.json, więc Twoje IDE od razu pomoże Ci pisać kod z typowaniem!
Definicje TypeScript dostarczane z React Native
Wersja 0.71 to pierwsze wydanie z wbudowanymi definicjami TypeScript (TS).
Wcześniej definicje TypeScript dla React Native były dostarczane przez @types/react-native hostowane w repozytorium DefinitelyTyped. Decyzja o umieszczeniu typów TypeScript razem ze źródłami React Native została podjęta w celu poprawy poprawności i utrzymania.
@types/react-native dostarcza typy tylko dla stabilnych wydań. Oznacza to, że jeśli chciałeś rozwijać aplikację z wersją przedpremierową React Native w TypeScript, musiałeś używać typów ze starszej wersji, które mogły być niedokładne. Wydawanie @types/react-native jest również podatne na błędy. Wydania opóźniają się względem wydań React Native, a proces wymaga ręcznej inspekcji zmian typów w publicznym API React Native i aktualizacji deklaracji TS.
Dzięki umieszczeniu typów TS razem ze źródłami React Native, zwiększa się widoczność i odpowiedzialność za typy TS. Nasz zespół aktywnie pracuje nad narzędziami do utrzymania zgodności między Flow i TS.
Ta zmiana eliminuje również zależność, którą musieli zarządzać użytkownicy React Native. Aktualizując do wersji 0.71 lub nowszej, możesz usunąć @types/react-native jako zależność. Sprawdź nowy szablon aplikacji, aby zobaczyć jak skonfigurować wsparcie dla TypeScript.
Planujemy wycofać @types/react-native dla wersji 0.73 i nowszych. Konkretnie oznacza to:
-
@types/react-nativeśledzące wersje React Native 0.71 i 0.72 zostaną wydane. Będą identyczne z typami w React Native na odpowiednich gałęziach wydania. -
Dla React Native 0.73 i nowszych, typy TS będą dostępne tylko z React Native.
Jak przeprowadzić migrację
Zachęcamy do migracji na nowe typy współzlokalizowane tak szybko, jak to możliwe. Oto szczegóły migracji w zależności od Twoich potrzeb.
Opiekun aplikacji
Po aktualizacji do React Native >= 0.71, możesz usunąć @types/react-native ze swoich devDependency.
Jeśli otrzymujesz ostrzeżenia, ponieważ używana przez Ciebie biblioteka odnosi się do @types/react-native jako peerDependency, zgłoś problem lub wyślij PR do tej biblioteki, aby używała opcjonalnych peerDependencies i na razie zignoruj ostrzeżenie.
Opiekun biblioteki
Biblioteki przeznaczone dla wersji React Native poniżej 0.71 mogą używać peerDependency do @types/react-native w celu sprawdzania typów względem wersji typów w aplikacji. Ta zależność powinna być oznaczona jako opcjonalna w peerDependenciesMeta, aby typy nie były wymagane dla użytkowników bez TypeScript lub dla użytkowników 0.71, gdzie typy są wbudowane.
Opiekun deklaracji TypeScript zależnych od @types/react-native
Sprawdź zmiany łamiące kompatybilność wprowadzone w 0.71, aby zobaczyć, czy jesteś gotowy do migracji.
Co jeśli używam Flow?
Użytkownicy Flow mogą nadal sprawdzać typy w aplikacjach przeznaczonych dla 0.71+, ale logika konfiguracji nie jest już domyślnie uwzględniona w szablonie.
Użytkownicy Flow wcześniej aktualizowali typy Flow React Native poprzez scalanie .flowconfig z nowego szablonu aplikacji i ręczną aktualizację flow-bin. Nowy szablon aplikacji nie zawiera już .flowconfig, ale jeden nadal istnieje w repozytorium React Native, który możesz wykorzystać jako podstawę dla swojej aplikacji.
Jeśli potrzebujesz rozpocząć nową aplikację React Native w Flow, możesz odnieść się do szablonu aplikacji z wersji 0.70.
Co jeśli znajdę błąd w deklaracji TypeScript?
Niezależnie od tego, czy używasz wbudowanych typów TS, czy @types/react-native, jeśli znajdziesz błąd, prześlij PR zarówno do repozytorium React Native, jak i DefinitelyTyped. Jeśli nie wiesz jak go naprawić, zgłoś problem na GitHubie w repozytorium React Native i oznacz @lunaleaps w zgłoszeniu.
Dokumentacja priorytetowo traktuje TypeScript
Aby zapewnić spójne doświadczenie z TypeScript, wprowadziliśmy kilka aktualizacji w dokumentacji React Native, aby odzwierciedlić TypeScript jako nowy domyślny język.
Przykłady kodu teraz pozwalają na wstawki TypeScript, a ponad 170 interaktywnych przykładów zostało zaktualizowanych, aby spełniały wymagania lintowania, formatowania i sprawdzania typów w nowym szablonie. Większość przykładów jest poprawna zarówno w TypeScript, jak i JavaScript. Tam gdzie są niezgodne, możesz zobaczyć przykład w obu językach.
Jeśli zauważysz błąd lub masz propozycję ulepszenia, pamiętaj że strona również jest open source i chętnie przyjmiemy Twoje PR-y!
Podziękowania dla społeczności TypeScript React Native!
Na zakończenie chcemy docenić całą pracę wykonaną na przestrzeni lat przez społeczność, aby zapewnić, że TypeScript jest użyteczny dla programistów React Native.
Chcemy podziękować wszystkim kontrybutorom, którzy utrzymywali @types/react-native od 2015 roku! Widzimy wysiłek i troskę, jaką wszyscy włożyliście w zapewnienie użytkownikom React Native najlepszego doświadczenia.
Dziękujemy @acoates, @eps1lon, @kelset, @tido64, @Titozzz oraz @ZihanChen-MSFT za pomoc w konsultacjach, zadawanie kluczowych pytań, komunikację i przeglądanie zmian związanych z przeniesieniem typów TypeScript do React Native.
Równie gorąco dziękujemy maintainerom szablonu react-native-template-typescript za wspieranie środowiska TypeScript dla nowych aplikacji w React Native od samego początku.
Z niecierpliwością oczekujemy bliższej współpracy bezpośrednio w repozytorium React Native, aby dalej udoskonalać doświadczenia deweloperskie w ekosystemie React Native!