Łatwiejsze aktualizacje dzięki Gitowi

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 →

Aktualizacja do nowszych wersji React Native bywała trudna. Prawdopodobnie spotkałeś się już z takim komunikatem:

Żadna z tych opcji nie jest idealna. Nadpisując plik, tracimy lokalne zmiany. Nie nadpisując, nie otrzymujemy najnowszych aktualizacji.

Dziś z dumą przedstawiam nowe narzędzie rozwiązujące ten problem. Narzędzie react-native-git-upgrade wykorzystuje Git w tle, aby automatycznie rozwiązywać konflikty tam, gdzie to możliwe.

Sposób użycia

Wymaganie: Git musi być dostępny w PATH. Twój projekt nie musi być zarządzany przez Gita.

Zainstaluj react-native-git-upgrade globalnie:

$ npm install -g react-native-git-upgrade

lub używając Yarna:

$ yarn global add react-native-git-upgrade

Następnie uruchom go w katalogu projektu:

$ cd MyProject
$ react-native-git-upgrade 0.38.0

Uwaga: Nie uruchamiaj 'npm install' aby zainstalować nową wersję react-native. Narzędzie musi móc porównać starą i nową szablon projektu. Po prostu uruchom je w folderze aplikacji jak powyżej, pozostając przy starej wersji.

Przykładowe wyjście:

Możesz też uruchomić react-native-git-upgrade bez argumentów, aby zaktualizować do najnowszej wersji React Native.

Staramy się zachować Twoje zmiany w plikach budowania Androida i iOS, więc nie musisz uruchamiać react-native link po aktualizacji.

Projektowaliśmy to rozwiązanie tak, aby było jak najmniej inwazyjne. Działa w oparciu o lokalne repozytorium Git tworzone dynamicznie w katalogu tymczasowym. Nie zakłóci działania repozytorium projektu (nieważne czy używasz Gita, SVN, Mercuriala czy niczego). Twoje źródła są przywracane w przypadku nieoczekiwanych błędów.

Jak to działa?

Kluczowy etap to generowanie łatki Git. Ta łata zawiera wszystkie zmiany wprowadzone w szablonach React Native pomiędzy wersją używaną przez Twoją aplikację a nową wersją.

Aby uzyskać tę łatę, generujemy aplikację ze szablonów osadzonych w pakiecie react-native w Twoim katalogu node_modules (to te same szablony, których używa komenda react-native init). Po wygenerowaniu natywnych aplikacji ze szablonów dla obecnej i nowej wersji, Git może wyprodukować łatę dostosowaną do Twojego projektu (tj. zawierającą nazwę Twojej aplikacji):

[...]

diff --git a/ios/MyAwesomeApp/Info.plist b/ios/MyAwesomeApp/Info.plist
index e98ebb0..2fb6a11 100644
--- a/ios/MyAwesomeApp/Info.plist
+++ b/ios/MyAwesomeApp/Info.plist
@@ -45,7 +45,7 @@
        <dict>
            <key>localhost</key>
            <dict>
-               <key>NSTemporaryExceptionAllowsInsecureHTTPLoads</key>
+               <key>NSExceptionAllowsInsecureHTTPLoads</key>
                <true/>
            </dict>
        </dict>
[...]

Teraz wystarczy zastosować tę łatę do Twoich plików źródłowych. Podczas gdy stary proces react-native upgrade pytałby o każdą drobną różnicę, Git potrafi automatycznie scalić większość zmian używając algorytmu 3-way merge, pozostawiając ewentualnie znane znaczniki konfliktów:

    13B07F951A680F5B00A75B9A /* Release */ = {
      isa = XCBuildConfiguration;
      buildSettings = {
        ASSETCATALOG_COMPILER_APPICON_NAME = AppIcon;
<<<<<<< ours
        CODE_SIGN_IDENTITY = "iPhone Developer";
        FRAMEWORK_SEARCH_PATHS = (
          "$(inherited)",
          "$(PROJECT_DIR)/HockeySDK.embeddedframework",
          "$(PROJECT_DIR)/HockeySDK-iOS/HockeySDK.embeddedframework",
        );
=======
        CURRENT_PROJECT_VERSION = 1;
>>>>>>> theirs
        HEADER_SEARCH_PATHS = (
          "$(inherited)",
          /Applications/Xcode.app/Contents/Developer/Toolchains/XcodeDefault.xctoolchain/usr/include,
          "$(SRCROOT)/../node_modules/react-native/React/**",
          "$(SRCROOT)/../node_modules/react-native-code-push/ios/CodePush/**",
        );

Takie konflikty są zazwyczaj łatwe do rozstrzygnięcia. Znacznik ours oznacza "Twój zespół", natomiast theirs można rozumieć jako "zespół React Native".

Dlaczego nowy globalny pakiet?

React Native posiada globalne CLI (pakiet react-native-cli), które deleguje polecenia do lokalnego CLI osadzonego w katalogu node_modules/react-native/local-cli.

Jak wspomnieliśmy wcześniej, proces musi zostać rozpoczęty z Twojej aktualnej wersji React Native. Gdybyśmy osadzili tę funkcjonalność w lokalnym CLI, nie moglibyście korzystać z tej funkcji przy używaniu starszych wersji React Native. Na przykład, nie bylibyście w stanie zaktualizować z wersji 0.29.2 do 0.38.0, gdyby ten nowy mechanizm aktualizacji był dostępny dopiero w wersji 0.38.0.

Aktualizacja oparta na Git to znacząca poprawa doświadczeń deweloperskich i ważne jest, aby udostępnić ją wszystkim. Dzięki użyciu oddzielnego pakietu react-native-git-upgrade zainstalowanego globalnie, możesz korzystać z tej nowej funkcji już dziś, niezależnie od wersji React Native używanego w Twoim projekcie.

Kolejnym powodem jest niedawna eliminacja Yeomana przez Martina Koniecka. Nie chcieliśmy przywracać tych zależności Yeoman do pakietu react-native tylko po to, aby móc generować łatkę poprzez porównanie starych i nowych szablonów.

Wypróbuj i przekaż swoją opinię

Podsumowując, życzę przyjemnego korzystania z nowej funkcji i zachęcam do zgłaszania sugestii i problemów, a szczególnie przesyłania pull requestów. Każde środowisko jest nieco inne i każdy projekt React Native jest inny - Twoja opinia pomoże nam dostosować to rozwiązanie do potrzeb wszystkich użytkowników.

Podziękowania

Serdeczne podziękowania dla wspaniałych firm Zenika i M6 Web (archived) - bez Waszego wsparcia nic z tego nie byłoby możliwe!