• Czas czytania ~8 min
  • 03.03.2023

Czy kiedykolwiek próbowałeś zaktualizować pakiet npm, a następnie zdałeś sobie sprawę, że łamie wszystkie inne pakiety w twoim projekcie Javascript?

Jest to częsty problem dla twórców stron internetowych, na szczęście istnieje kilka prostych kroków, które należy wykonać przed aktualizacją modułu.

W tym poście na blogu pokażę, jak zaktualizować pakiety npm bez przerywania projektu, wykonując 4 proste kroki:Ściągawka: 6 niezbędnych poleceń doaktualizacji pakietów npm Krok 1:

  1. Understand npm package versioning
  2. Audit installed npm packages
  3. Update only one npm package at time
  4. Test your code after updating npm packages

Zrozum wersjonowanie

pakietów

npm Wersjonowanie jest ważną częścią npm i bezpiecznego korzystania z aktualizacji podczas tworzenia aplikacji internetowych.

Większość pakietów npm jest zgodna z wytycznymi dotyczącymi wersjonowania semantycznego.

Wersjonowanie semantyczne oznacza, że programiści powinni utworzyć wersję pakietu składającą się z trzech liczb oddzielonych kropkami (np. "0.12.31").

MAJOR. MAŁOLETNI. Format

przechowywania wersji poprawek Pierwsza liczba, nazywana wersją główną, wskazuje, jak ważne jest to wydanie w stosunku do innych wydań z tymi samymi poziomami minor i patch. Główny numer wersji wskazuje niezgodne zmiany interfejsu API.

Druga liczba, zwana wersją pomocniczą, wskazuje, ile nowych funkcji zostało wprowadzonych od ostatniego znaczącego wydania; Na przykład, jeśli ta zmiana była tylko drobnymi poprawkami lub ulepszeniami istniejących funkcji i nie wprowadzono żadnych zmian w zachowaniu, spowoduje to wyższą wartość. Wydania pomocnicze nie są tak ryzykowne jak wersje główne, ponieważ zazwyczaj wprowadzają nowe funkcje, ale nie są tak ryzykowne jak główne aktualizacje, ponieważ nie wprowadzono żadnych zmian w interfejsie API.

Trzecia liczba nazywa się wersją łatki i wskazuje, ile poprawek błędów lub ulepszeń zostało wprowadzonych od ostatniego pomniejszego wydania; Na przykład, jeśli ta zmiana była tylko drobnymi poprawkami lub ulepszeniami istniejących funkcji i nie dodano żadnych zmian w zachowaniu.

Co oznaczają

daszek (^) i tylda (~)? W package.json, wersja może mieć ^ z przodu (np. ), co oznacza, że najnowsza wersja pomocnicza może być bezpiecznie zainstalowana.

^0.12.31 Tylda (~) z przodu (np. ) oznacza, ~0.12.31że najnowsza wersja poprawki jest bezpieczna do zainstalowania.

Npm package dependencies listed in package.json file.

Przykład pakietów npm, które są wymienione jako zależności w pliku package.json. Wszystkie zależności mają z przodu daszek (^), co pokazuje, że można bezpiecznie zainstalować najnowsze wersje pomocnicze.

package.json
package.json to plik, który śledzi wszystkie pakiety potrzebne do poprawnego działania aplikacji, a także ustawienia dotyczące jej zachowania podczas uruchamiania na różnych platformach i środowiskach.

Krok 2: Przeprowadź inspekcję zainstalowanych pakietów

npm Zanim zaktualizujesz pakiety npm, dowiedz się, czy masz dobry powód.

Lepiej trzymać się wersji pakietu, która działa. W ten sposób nie będziesz miał ryzyka, że coś się zepsuje.

Główne powody aktualizacji pakietów npm to:

  • Najnowsza wersja pakietu posiadająca funkcję, którą chcemy
  • Naprawiono błędy w najnowszej wersji pakietu npm
  • Zaktualizowano zależności dla innego pakietu, którego używasz
  • Luka w zabezpieczeniach pakietu npm
  • Aktualizacja środowiska, w którym działa projekt, nie jest zgodna z bieżącą wersją pakietu npm

Kilka poleceń npm, które pomogą Ci sprawdzić pakiety przed aktualizacją:

  • npm list --depth 0 Wyświetla listę wszystkich pakietów na najwyższym poziomie
  • Inspekcja npm npm nieaktualna Sprawdza luki w zabezpieczeniach lub nieaktualne wersje
  • Wyświetla raport wersji pakietów w porównaniu z wersjami określonymi w package.json pliku

npm list --depth 0

npm list --depth 0 lists all installed npm packages, but only at the top level.

Lista pakietów na najwyższym poziomie jest wystarczająca przez większość czasu. Zależności najwyższego poziomu zazwyczaj dbają o swoje wewnętrzne zależności.

Inspekcja npm npm nieaktualna

Inspekcja npm npm nieaktualna will run a security vulnerability check against your project and report any found issues. It is not perfect, but it helps to find potential problems if you are using npm packages that have security vulnerabilities. It's not perfect because not all vulnerabilities are reported to npm.

An example of output when running ` Inspekcja npm npm nieaktualna` command.

Inspekcja npm npm nieaktualna shows you a list of vulnerable packages, including the npm dependency tree.

will report any out-of-date packages in your project.

Pokazuje bieżące, poszukiwane i najnowsze wersje w porównaniu do wersji określonych w pliku package.json.

  • Current: to aktualnie zainstalowana wersja.
  • Poszukiwane: Maksymalna wersja pakietu, która jest dozwolona przez zakres wersji w package.json.
  • Najnowsza: wersja pakietu jest oznaczona jako "najnowsza" w rejestrze npm.

Note: command only shows the direct dependencies of the root project. But if you want to see other dependencies also, then use "--all."

An example of output when running ` Inspekcja npm npm nieaktualna` command.

prints out a list of all installed packages that have updates available.

Sprawdź, czy nie wprowadzono przełomowych zmian przed aktualizacją

Niektóre pakiety npm wprowadzą przełomowe zmiany, które mogą powodować błędy podczas korzystania z modułu.

Przed wprowadzeniem przełomowej zmiany deweloperzy pakietów często dodają komunikaty "Breaking Changes" do danych wyjściowych konsoli. Oznacza to, że moduł zmieni się w przyszłych wersjach, a programiści muszą mieć na niego oko.

Aby sprawdzić, czy są jakieś przełomowe zmiany, możesz również zajrzeć do sekcji "Przełomowe zmiany" w pliku readme pakietu.

Zazwyczaj plik readme pakietu można znaleźć w:

  • Strona pakietu NPM w rejestrze NPM
  • Wewnątrz katalogu modułu, sprawdź node_modules folder wewnątrz projektu
  • strona projektu (lub GitHub)

Krok 3: Aktualizuj tylko jeden pakiet na raz

Podczas aktualizacji musimy uważać, aby aktualizować tylko pakiety, które chcemy. Nie ma potrzeby aktualizowania wszystkich modułów w tym samym czasie.

Zacznij od aktualizacji w małych partiach i przetestuj każdą partię pod kątem wszelkich problemów, które mogą się pojawić. Pozwoli to dowiedzieć się, jak wpływa to na Twój projekt i pozwoli Ci wyizolować wszelkie błędy.

Aktualizacja

npm Zmiana wersji pakietu w pliku package.json i uruchomiona npm install najprawdopodobniej nic nie da, ponieważ już zainstalowana wersja pakietu spełnia wersjonowanie w pliku package.json.

Rather than using npm install, you can use the Aktualizacja command to upgrade already installed packages. When you run a Aktualizacja, npm checks if there are newer versions out there that satisfy specified semantic versioning ranges that you specified in package.json and installs them.

Aby zaktualizować określony pakiet npm, uruchom następujące polecenie w konsoli:

Jak cofnąć aktualizacje pakietu npm?

Jeśli są jakieś błędy, możesz łatwo cofnąć zmiany za pomocą tych dwóch poleceń:

Powinna @version to być ta sama wersja, którą zainstalowałeś wcześniej.

Krok 4: Przetestuj kod po zainstalowaniu nowych pakietów Aby upewnić się, że kod nadal działa po zaktualizowaniu pakietów

npm, ważne jest, aby przetestować funkcjonalność przed wdrożeniem. Dzieje się tak, ponieważ aktualizacja pakietu może powodować błędy w aplikacji, jeśli użytkownik nie zachowa ostrożności. Aby uniknąć tych problemów, zalecam uruchamianie wszystkich testów po stronie serwera i klienta, a także ręczne sprawdzanie komunikatów o błędach JavaScript w całej witrynie.

Kroki:

  • Uruchom wszystkie testy jednostkowe i integracyjne zarówno po stronie serwera, jak i klienta, uruchamiając npm test lub równoważne polecenie dla projektu.
  • Przejrzyj dzienniki pakietów pod kątem wskazówek dotyczących przyczyny problemu lub wystąpienia problemów podczas instalacji

Te 3 proste kroki pomogą Ci uniknąć zepsucia projektu, ostrożnie instalując nowe pakiety npm.

Jakie są inne sposoby, w jakie ludzie zepsuli swoje projekty? Daj nam znać w komentarzach poniżej, a my napiszemy o nich post na blogu!

Dodatkowa wskazówka: Wyczyść pamięć podręczną npm Od npm@5 r. pamięć podręczna

npm samoleczy się z problemów z uszkodzeniem, a dane wyodrębnione z pamięci podręcznej są gwarantowane. Jeśli chcesz się upewnić, że wszystko jest spójne, użyj zamiast tego "npm cache verify". Z drugiej strony, jeśli debugujesz problem z instalatorem, możesz użyć npm install --cache /tmp/empty-cache tymczasowej pamięci podręcznej zamiast nuking rzeczywistej.

Czasami npm nie pobiera najnowszej wersji pakietu, ponieważ ma starszą wersję przechowywaną w pamięci podręcznej. Od npm@5 problemy z pamięcią podręczną nie powinny się zdarzać. Ale nadal czasami to robią.

To clear npm cache, run npm cache clean --force. This command clears npm's cache of all the packages that your project has installed with npm install or Aktualizacja.

Nie usuwa żadnych zależności z pliku package.json, ale może pomóc w rozwiązaniu problemu zależności, jeśli w pamięci podręcznej znajduje się nieaktualna wersja i nie można znaleźć, która to jest, przeglądając listę pakietów.

Ściągawka: 6 poleceń, które pomogą Ci zaktualizować pakiety

npm Ta ściągawka ułatwi bezpieczną aktualizację pakietów npm w aplikacji węzła. Zawiera listę poleceń, które pomogą Ci nadążyć za najnowszymi aktualizacjami i uniknąć przełomowych zmian.

  • Use npm list --depth 0 to list all the packages in your package directory
  • Use Inspekcja npm npm nieaktualna to find out which of your npm dependencies are vulnerable.
  • Use to list the packages that are out of date with respect to what is installed in package.json
  • Use Aktualizacja package_name to update an individual package that has already been installed.
  • Use npm uninstall package_name and npm install package_name@version to revert to a specific version.
  • Use npm cache clean --force to clear npm's cache of all the packages that have been installed.

Opublikowano:

Comments

No comments yet
Yurij Finiv

Yurij Finiv

Full stack

O

Professional Fullstack Developer with extensive experience in website and desktop application development. Proficient in a wide range of tools and technologies, including Bootstrap, Tailwind, HTML5, CSS3, PUG, JavaScript, Alpine.js, jQuery, PHP, MODX, and Node.js. Skilled in website development using Symfony, MODX, and Laravel. Experience: Contributed to the development and translation of MODX3 i...

O autorze CrazyBoy49z
WORK EXPERIENCE
Kontakt
Ukraine, Lutsk
+380979856297