Przejdź do treści głównej

React Native 0.72 - Obsługa dowiązań symbolicznych, lepsze komunikaty o błędach i więcej

· 8 minut czytania
Lorenzo Sciandra
Lorenzo Sciandra
Senior Software Engineer @ Microsoft
Marek Fořt
Marek Fořt
Software Engineer @ Shopify
Riccardo Cipolleschi
Riccardo Cipolleschi
Software Engineer @ Meta
Luna Wei
Luna Wei
Software Engineer @ Meta
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 →

Dziś wydajemy wersję 0.72!

To wydanie wprowadza długo oczekiwane funkcje dla Metro, lepszą obsługę błędów oraz inne ulepszenia dla deweloperów. Wiele z tych prac zostało zrealizowanych dzięki Waszym opiniom z ankiety społecznościowej 2022 — dziękujemy wszystkim uczestnikom!

Najważniejsze zmiany

Zmiany łamiące kompatybilność

Najważniejsze zmiany

Nowe funkcje Metro

Obsługa dowiązań symbolicznych (Beta)

Obsługa dowiązań symbolicznych pozostaje jedną z najbardziej oczekiwanych funkcji w Metro. W React Native 0.72 z dumą ogłaszamy jej wsparcie w wersji beta.

Obsługa symlinków pozwala React Native płynnie współpracować z monorepo i pnpm, eliminując potrzebę stosowania obejść. Aby użyć tej funkcji w aplikacji, zobacz Włączanie funkcji beta.

Funkcja jest obecnie w fazie beta, by zebrać opinie o doświadczeniach deweloperów w różnych środowiskach pracy. Więcej szczegółów znajdziesz tutaj. Planujemy domyślnie włączyć obsługę symlinków w wersji 0.73.

Obsługa Package Exports (Beta)

Package Exports to nowoczesna alternatywa dla pola "main" w package.json, umożliwiająca pakietom npm definiowanie publicznego API i obsługę React Native.

Włączając obsługę Package Exports w konfiguracji Metro, Twoja aplikacja zyska kompatybilność z szerszym ekosystemem JavaScript, w tym poprzez nowy warunek społecznościowy "react-native". Zobacz Włączanie funkcji beta by użyć tej funkcji.

wskazówka

Dowiedz się więcej o tej funkcji i naszych planach stabilnego wdrożenia w artykule Obsługa Package Exports w React Native.

Włączanie funkcji beta

Aby aktywować te funkcje w projekcie, zaktualizuj plik metro.config.js swojej aplikacji i ustaw opcję resolver.unstable_enableSymlinks lub resolver.unstable_enablePackageExports.

const config = {
// ...
resolver: {
unstable_enableSymlinks: true,
unstable_enablePackageExports: true,
},
};

Nowa konfiguracja metro.config.js

W React Native 0.72 zmieniliśmy sposób ładowania konfiguracji dla Metro w React Native CLI. Zaktualizuj plik metro.config.js w swoim projekcie, dopasowując go do wersji z szablonu.

informacja

Zaktualizuj swój plik konfiguracyjny do następującego formatu. Możesz również skorzystać z upgrade-helper.

Te zmiany formatu w metro.config.js staną się obowiązkowe w wersji 0.73. W 0.72 wyświetlimy ostrzeżenie, jeśli plik nie zostanie zaktualizowany.

To przenosi kontrolę nad rozszerzaniem podstawowej konfiguracji Metro React Native do Twojego projektu, usuwając przy tym zbędne domyślne ustawienia. Dodatkowo oznacza to, że niezależne polecenia CLI Metro, takie jak metro get-dependencies, będą teraz działać.

Usprawnienia dla programistów

Koniec czerwonych ekranów przy nieprawidłowych właściwościach stylu

Przed tą wersją podanie nieprawidłowej właściwości stylu w StyleSheet powodowało czerwony ekran błędu. To wysoki priorytet błędu, który zakłócał przepływ pracy programisty przy stosunkowo niskim ryzyku.

W 0.72 złagodziliśmy to zachowanie - błędy będą teraz ignorowane w trybie cichym, podobnie jak w przypadku podania nieprawidłowej właściwości CSS w przeglądarce. Zaktualizowaliśmy również typy, aby niektóre błędy były wykrywane podczas kompilacji zamiast w czasie wykonania.

Lepsza czytelność błędów w Hermes

Hermes dodał lepszy komunikat błędu przy próbie wywołania niezdefiniowanej funkcji.

    var x = undefined; x();
// Before: undefined is not a function
// After: x is not a function (it is undefined)

Dodatkowo, ślady stosu w LogBox filtrują teraz wewnętrzne ramki bajtkodu Hermes, które nie są istotne dla użytkowników aplikacji.

Ulepszone komunikaty błędów w React Native CLI

Wersja 0.72 zawiera React Native CLI v11 z ulepszeniami redukującymi duplikację komunikatów, precyzującymi sformułowania, skracającymi niepotrzebne ślady stosu oraz dodającymi bezpośrednie linki do dokumentacji w poleceniach init, run-android i run-ios.

Inne ulepszenia znajdziesz w dziennikach zmian React Native CLI.

Szybsza kompilacja i parsowanie JSON w Hermes

Hermes poprawił czas kompilacji dużych literałów obiektów. Na przykład w zgłoszonym problemie #852 użytkownik miał cały zestaw danych zapisany jako duży literał obiektu. Poprawiając algorytm deduplikacji w Hermesie, kompilacja przyspieszyła o 97% (221c). Te ulepszenia skorzystają aplikacjom pakującym wiele obiektów.

Wprowadzono także wiele optymalizacji parsowania JSON (de9c, 6e2d), co przyniesie korzyści aplikacjom używającym bibliotek takich jak redux-persist, które intensywnie manipulują danymi JSON.

Większe wsparcie ECMAScript w Hermes

W React Native 0.72 dodano w Hermes wsparcie dla następujących specyfikacji:

Dla użytkowników JSC te funkcje są już dostępne.

Aktualizacje Nowej Architektury

Nowa Architektura jest obecnie w fazie eksperymentalnej. Aby skupiać aktualizacje na docelowej grupie odbiorców, w wersji 0.72 i kolejnych przenosimy informacje o Nowej Architekturze do dedykowanej grupy roboczej. Ta zmiana umożliwi też częstsze aktualizacje, np. dla zmian z wersji nightly.

Aktualizacje Nowej Architektury dla wersji 0.72 znajdziesz tutaj. Subskrybuj powiadomienia GitHub grupy roboczej, by śledzić postępy prac nad Nową Architekturą.

Zmiany łamiące kompatybilność

Usunięte przestarzałe komponenty

Następujące pakiety zostały usunięte z React Native w wersji 0.72. Zamiast nich zalecamy migrację do pakietów społecznościowych:

Zmiany nazw pakietów

Wszystkie pakiety publikowane z głównego repozytorium react-native znajdują się teraz w react-native/packages i są publikowane w zakresie npm @react-native dla jasnego określenia własności.

Brak zmian w pakiecie react-native.

Old Package NameNew Package Name
@react-native-community/eslint-config@react-native/eslint-config
@react-native-community/eslint-plugin@react-native/eslint-plugin
@react-native/polyfills@react-native/js-polyfills
@react-native/normalize-color@react-native/normalize-colors
@react-native/assets@react-native/assets-registry
react-native-codegen@react-native/codegen
react-native-gradle-plugin@react-native/gradle-plugin

Zmiana nie wpłynie na Ciebie, jeśli nie masz bezpośrednich zależności do zmienionych pakietów. W przeciwnym razie przy aktualizacji do React Native 0.72 zaktualizuj zależności do wersji ~0.72.

Motywację tych zmian znajdziesz w dedykowanym RFC.

Podziękowania

Duża część tej wersji powstała dzięki bezpośrednim opiniom społeczności. Od zgłoszeń dotyczących hałaśliwych czerwonych okien, błędów związanych z Package Exports, po testy wydajnościowe Nowej Architektury – wszystkie te informacje są dla nas cenne i doceniamy czas poświęcony na ich przekazanie.

Wersja 0.72 zawiera ponad 1100 commitów od 66 współtwórców. Dziękujemy za waszą ciężką pracę!

Aktualizacja do wersji 0.72

Sprawdź listę wymaganych zmian w upgrade-helper, przeczytaj dokumentację aktualizacji aby dowiedzieć się jak zaktualizować istniejący projekt, lub utwórz nowy projekt poleceniem npx react-native@latest init MyProject.

Jeśli używasz Expo, wersja React Native 0.72 będzie obsługiwana w wydaniu Expo SDK 49.

informacja

Wersja 0.72 jest teraz najnowszą stabilną wersją React Native, a wersja 0.69.x przechodzi do kategorii nieobsługiwanych. Więcej informacji znajdziesz w polityce wsparcia React Native.