• Час читання ~2 хв
  • 03.03.2023

Ви коли-небудь пробували оновити пакет npm, а потім зрозуміли, що він порушує всі інші пакети у вашому проекті Javascript?

Це поширена проблема для веб-розробників, на щастя, перед оновленням модуля потрібно зробити кілька простих кроків.

У цьому блозі я покажу вам, як оновити пакети npm, не порушуючи ваш проект, виконавши 4 прості кроки:

  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

Шпаргалка: 6 команд, які потрібно знати для оновлення пакетівnpm Крок 1: Зрозумійте керування версіями

пакетів

npm Керування версіями є важливою частиною npm і як безпечно використовувати оновлення при розробці веб-додатків.

Більшість пакунків npm відповідають рекомендаціям щодо семантичних версій.

Семантичне керування версіями означає, що розробники повинні скласти версію пакета з трьох чисел, розділених крапками (наприклад, "0.12.31").

ОСНОВНИХ. НЕЗНАЧНІ. Формат

керування версіями PATCH Перше число, яке називається основною версією, вказує на те, наскільки це важливий випуск порівняно з іншими випусками з такими самими проміжними рівнями та рівнями виправлення. Основний номер версії вказує на несумісні зміни API.

Друге число, зване проміжною версією, вказує на те, скільки нової функціональності було введено з моменту останнього значного випуску; Наприклад, якщо ця зміна була лише невеликими виправленнями або покращеннями існуючих функцій і не було внесено жодних змін у поведінці, це призведе до вищого значення. Проміжні випуски не такі ризиковані, як основна версія, оскільки вони зазвичай вводять нові функції, але вони не такі ризиковані, як великі оновлення, оскільки зміни API не вносилися.

Третє число називається версією виправлення і вказує, скільки виправлень помилок або покращень було введено з часу останнього незначного випуску; Наприклад, якщо ця зміна була лише невеликими виправленнями або покращеннями наявних функцій і не було додано жодних змін поведінки.

Що означають каретка (^) і тильда (~)?

У package.json версія може мати ^ спереду (наприклад, ), що означає, ^0.12.31що останній проміжний випуск може бути безпечно встановлений.

Тильда (~) спереду (наприклад, ) означає, ~0.12.31що останній випуск виправлення безпечний для встановлення.

Npm package dependencies listed in package.json file.

Приклад пакунків npm, які перераховані як залежності у файлі package.json. Усі залежності мають каретку (^) спереду, показуючи, що безпечно встановлювати останні проміжні версії.

package.json
package.json - це файл, який відстежує всі пакети, необхідні вашому додатку для належного запуску, а також налаштування того, як він повинен поводитися при запуску на різних платформах і середовищах.

Крок 2: Аудит встановлених пакетів npm Перш

ніж оновлювати пакети npm, з'ясуйте, чи є у вас вагомі причини для цього.

Краще дотримуватися версії пакета, яка працює. Таким чином, у вас не буде ризику щось зламати.

Основними причинами оновлення пакетів npm є:

  • Остання версія пакета з функцією, яку ми хочемо
  • Виправлені помилки в останній версії пакета npm
  • Оновлено залежності для іншого пакунка, який ви використовуєте
  • Уразливість системи безпеки в пакеті npm
  • Оновлення середовища, в якому запущений проект, несумісне з поточною версією пакета npm

Пара команд npm, які допоможуть вам перевірити ваші пакунки перед оновленням:

  • Список npm --глибина 0 список всіх пакунків на верхньому рівні
  • Аудит Перевірка на наявність вразливостей системи безпеки або застарілих версій
  • npm npm застарілийВідображає звіт про версії пакетів порівняно з версіями, зазначеними у файлі package.json

Список npm --глибина 0

Список npm --глибина 0 lists all installed npm packages, but only at the top level.

Більшості часу достатньо лістингових пакетів на верхньому рівні. Залежності верхнього рівня зазвичай піклуються про свої внутрішні залежності.

Аудит

Аудит 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 ` Аудит` command.

Аудит shows you a list of vulnerable packages, including the npm dependency tree.

npm npm застарілий

npm npm застарілий will report any out-of-date packages in your project.

Він показує поточні, потрібні та останні версії порівняно з версіями, зазначеними у файлі package.json.

  • Current: є поточною встановленою версією.
  • Потрібно: максимальна версія пакета, дозволена діапазоном версій у package.json.
  • Остання: версія пакета - це та, яка позначена як "остання" в реєстрі npm.

Note: npm npm застарілий 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 ` Аудит` command.

npm npm застарілий prints out a list of all installed packages that have updates available.

Перевірте наявність змін перед оновленням

Деякі пакунки npm внесуть ламаючі зміни, що може спричинити помилки при використанні модуля.

Перш ніж внести кардинальні зміни, розробники пакетів часто додають повідомлення «Breaking Changes» до консолі. Це означає, що модуль буде змінюватися в майбутніх версіях, і розробникам потрібно стежити за ним.

Щоб побачити, чи є якісь кардинальні зміни, ви також можете переглянути розділ "Breaking Changes" файлу readme пакета.

Зазвичай файл readme пакунка можна знайти в:

  • Сторінка пакета NPM в реєстрі NPM
  • всередині каталогу модулів, перевірте node_modules папку всередині вашого проекту
  • сайт проекту (або GitHub)

Крок 3: Оновіть лише один пакет одночасно

Під час оновлення нам потрібно бути обережними, щоб оновлювати лише потрібні пакети. Немає необхідності оновлювати всі модулі одночасно.

Почніть із внесення оновлень невеликими партіями та перевірте кожну партію на наявність будь-яких проблем, які можуть виникнути. Це дозволить вам з'ясувати, як це впливає на ваш проект, і дозволить вам ізолювати будь-які помилки.

Оновлення

npm Зміна версії пакета у файлі package.json та запуск npm install , швидше за все, нічого не дасть, оскільки вже встановлена версія пакета задовольняє керування версіями у файлі package.json.

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

Щоб оновити певний пакунок npm, запустіть наступне в console:

Як повернути оновлення пакета npm?

Якщо є якісь помилки, ви можете легко скасувати зміни за допомогою цих двох команд:

The @version має бути тієї ж версії, яку ви встановили раніше.

Крок 4: Перевірте свій код після встановлення нових пакетів Щоб переконатися, що ваш код все ще працює після оновлення пакетів

npm, важливо перевірити функціональність перед розгортанням. Це пов'язано з тим, що оновлення пакета може спричинити помилки у вашій програмі, якщо ви не будете обережні. Щоб уникнути цих проблем, я рекомендую запускати всі тести на стороні сервера та клієнта, а також вручну перевіряти наявність будь-яких повідомлень про помилки JavaScript на сайті.

Кроки:

  • Запустіть усі модульні та інтеграційні тести як з боку сервера, так і з боку клієнта, запустивши npm test або еквівалентну команду для вашого проекту.
  • Перегляньте журнали пакунків, щоб дізнатися, що спричинило проблему або де щось пішло не так під час інсталяції

Ці 3 простих кроки можуть допомогти вам уникнути розриву вашого проекту, обережно встановлюючи нові пакети npm.

Якими ще способами люди зламали свої проекти? Повідомте нас у коментарях нижче, і ми напишемо про них публікацію в блозі!

Бонусна порада: очистити кеш npm Станом на npm@5 кеш npm самовідновлюється від проблем з корупцією, і дані, витягнуті з кешу

, гарантовано дійсні. Якщо ви хочете переконатися, що все узгоджено, замість цього використовуйте "npm cache verify". З іншого боку, якщо ви налагоджуєте проблему з інсталятором, ви можете використовувати npm install --cache /tmp/empty-cache тимчасовий кеш замість того, щоб знищувати фактичний.

Іноді npm не витягує останню версію пакета, оскільки він має старішу версію, що зберігається в кеші. Станом на npm@5, проблеми з кешем не повинні відбуватися. Але вони все одно іноді роблять.

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 Оновлення.

Він не видаляє жодних залежностей з package.json, але може допомогти вирішити проблему залежності, якщо в кеші є застаріла версія і ви не можете знайти, яка саме з них, переглянувши список пакунків.

Шпаргалка: 6 команд, які допоможуть вам оновити пакети npm Ця шпаргалка дозволить легко безпечно оновлювати пакети

npm у вашому додатку вузла. Він включає в себе список команд, які допоможуть вам бути в курсі останніх оновлень і уникнути кардинальних змін.

  • Use Список npm --глибина 0 to list all the packages in your package directory
  • Use Аудит to find out which of your npm dependencies are vulnerable.
  • Use npm npm застарілий to list the packages that are out of date with respect to what is installed in package.json
  • Use Оновлення 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.

Опубліковано:

Comments

No comments yet
Yurij Finiv

Yurij Finiv

Full stack

Про мене

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...

Про автора CrazyBoy49z
WORK EXPERIENCE
Контакти
Ukraine, Lutsk
+380979856297