Вы рекомендовали использовать ключи -DE, в статье просто -D, в документации:

npm install webpack-dev-server --save-dev

Объясните, что делают различные флаги при установке пакетов -D-DE--save-dev? Чем они отличаются? Что по факту делает этот флаг? Что будет если его не поставить при установке пакета?

Для обновления пакетов мы используем ключи -DE (их следует писать прописными). Это сокращённая запись.

D — псевдоним для-save-dev. Когда мы используем D, то подразумеваем, что пакет должен быть установлен в devDependencies (зависимости для разработки).

E — псевдоним для-save-exact. С помощью этого параметра фиксируем версию. Если им не воспользоваться, то рядом с версией пакета в package.json появится «крышечка», символ^.

Вот и получается, что указание -DE равносильно применению --save-dev и --save-exact. Разницы нет никакой. Просто запись короче и проще запомнить, но это вкусовщина. Каждый делает, как нравится.

Что за символ ^

Если мы установим любой пакет вот так (без фиксации версии): 

npm i eslint -D

то в package.json получим что-то вроде этого:

"devDependencies": {
    "eslint": "^7.0.1"
}

Представим, что мы захотели обновить версию пакета. Для этого в npm предусмотрена отдельная команда: 

npm update eslint

До какой версии будет обновлён пакет eslint — до самой свежей или нет?

Семантическое версионирование

Чтобы ответить, посмотрим, из чего строится номер версии (например, 7.0.1). Для нумерации применяется семантическое версионирование SEMVER. Оно работает так:

👉 Мажорный номер версии — 7. Он меняется в важных случаях — например, когда теряется обратная совместимость с прошлой версией, добавлено или удалено новое API и так далее.

Минорный номер версии — 0. Меняется, когда добавляются новые возможности без потери обратной совместимости.

Патч версия — 1. Изменяется, когда вносятся баг-фиксы или мелкие улучшения, не добавляющие новую функциональность и не влияющие на обратную совместимость.

Дополнительные символы нужны, чтобы задать критерий обновления:

  • ^ (крышечка) — совместимость на уровне мажорной-версии. Пакет может быть обновлён до максимально свежей версии в пределах текущей мажорной.
  • ~ (тильда) — совместимость на уровне патч-версии. Пакет может быть обновлён до максимально свежей версии в пределах текущей мажорной и минорной версии.

Как появляется крышечка

При установке новых пакетов npm по умолчанию для всех пакетов добавляет символ «крышечки», то есть фиксирует совместимость на уровне мажорной версии. Поэтому при обновлении мы можем беспрепятственно получать свежие версии и случайно не перепрыгнуть на следующую мажорную версию, где может измениться API и проект перестанет корректно работать.

Теоретически всё здорово, но при условии, что мы живём в идеальном мире. Не все разработчики придерживаются правил семантического версионирования и запросто может произойти ситуация, когда изменения в пределах мажорной версии могут что-то сломать.

Чтобы не столкнуться с такой ситуацией, мы фиксируем номер версии, то есть в package.json не должно быть дополнительных символов ^ и ~ Для этого мы и применяем параметр --save-exact или его алиас (-E).

Другие материалы