Обновите Angular CLI в существующем проекте

Я работаю над angular-cli 1.0.4 в существующем проекте, я хотел бы обновить версию до 1.2.4. Каков наилучший способ удалить старую версию и обновить ее до новой версии, используя npm, чтобы повлиять на мой существующий проект? которая обновляет версию в файле package.json.

Источник

4 ответа

Руководство по обновлению your angular cli в any версия

ОБНОВЛЕНИЕ 23 октября 2018 года: как обновить приложение, когда лучше всего подойдет для изменения версии и изменения версии:

Если вы используете Angular CLI версии 6+, просто запустите ng update затем следуйте инструкциям командной строки. Также ознакомьтесь с этим руководством Обновление ваших Angular проектов

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

Поэтому сначала просто установите angular cli, в котором вы хотите обновить свой проект, так как https://github.com/angular/angular-cli говорит:

npm uninstall -g @angular/cli
npm cache clean
npm install -g @angular/cli@<put exact version here>

Шаги для обновления:

  1. Создать new blank проект как ng new project-name Вы можете назвать свой new "playground" project так же, как ваш old project , но убедитесь, что он находится в папке, отличной от текущей.

  2. Скопируйте / замените ваш app папка из вашего old project в new project ты только что создал

  3. Внесите все пользовательские изменения во все остальные файлы в проекте:
    3a. Поместите все связанные с вашим проектом пакеты npm из вашего старого проекта в package.json (используйте инструмент сравнения) разница между вашим старым и новым package.json будет просто @anngular/cli@version и связанные с ним версии пакетов, такие как karma , так далее
    3b. Используя инструмент сравнения (см. ОБНОВЛЕНИЕ ниже), убедитесь, что вы привезли все свои пользовательские вещи из всех связанных с cli файлов, таких как .angular-cli.json, .gitignore, index.html, src/polyfills.ts, src/main.ts, src/test.ts, так далее

  4. Бежать npm install или же yarn

  5. Проверить все npm scripts:
    5а - Бег ng serve чтобы убедиться, что это работает, если не исправить ошибки
    5б - Бег ng build чтобы убедиться, что это работает, если не исправить ошибки
    5с - запустить ng lint чтобы убедиться, что это работает, если не исправить ошибки
    5d - Бег ng test чтобы убедиться, что это работает, если не исправить ошибки ( вот ошибка, которую я поймал во время этого шага)
    5е - проверить все остальное npm scripts что ваше приложение полагается.

Как только вы закончите со всем выше, вы можете удалить или заархивировать old project на всякий случай и продолжать идти с new project с этого момента.

ОБНОВЛЕНИЕ: вы также можете использовать этот angular-cli-diff, чтобы узнать разницу между версиями, например, https://github.com/cexbrayat/angular-cli-diff/compare/1.4.0...1.5.0 (см. Files changed вкладка)

Итак, с angular-cli-diff вы делаете:

  1. Разные версии, например: https://github.com/cexbrayat/angular-cli-diff/compare/1.4.0...1.5.0
  2. нажмите на File changed табуляция
  3. Примените изменения к вашему текущему проекту.
  4. npm install / yarn
  5. Проверьте изменения в шаге 5(a-e) как указано выше
Источник

Посмотрите документы Angular-Cli. Вам не нужно создавать новый проект.

Глобальный пакет:

npm uninstall -g @angular/cli
npm cache clean
# if npm version is > 5 then use `npm cache verify` to avoid errors (or to avoid using --force)
npm install -g @angular/cli@latest

Локальный проектный пакет:

rm -rf node_modules dist # use rmdir /S/Q node_modules dist in Windows Command Prompt; use rm -r -fo node_modules,dist in Windows PowerShell
npm install --save-dev @angular/cli@latest
npm install
Источник

Обновление минорной версии AngularCLI v.1.xx

ПРИМЕЧАНИЕ. Если вы обновляете версию 1.0 до бета-версии или версии RC, ознакомьтесь с Руководством по обновлению 1.0.

AngularCLI не поддерживает автоматическое обновление версии CLI и зависимостей от существующих проектов. Однако поддержание последней версии может быть весьма полезным, поскольку вы получаете новейшие функции, улучшения производительности и исправления ошибок.

Мне удалось успешно обновить мой проект с v.1.1.0 до v1.3.0, выполнив следующие действия:

  1. Обновите версию глобального AngularCLI (следуйте инструкциям в этом руководстве)

  2. Создайте "upgrade-проект" с последней версией, которую вы недавно установили

    $: ng new upgrade-project --skip-install

    Это создаст проект в новой папке и зафиксирует исходные файлы.

  3. Создайте и примените обновление с помощью Git

    Вы можете использовать обычный git format-patch / apply или поддержку вашей любимой IDE (например, WebStorm)

    $: git format-patch -1 HEAD --stdout > cli-upgrade.patch
$: git apply cli-upgrade.patch

  4. Внимательно просмотрите изменения и проверьте, какие из них действительно необходимы

    ПРИМЕЧАНИЕ: вам нужно будет правильно объединить измененные файлы

  5. Переустановите обновленные зависимости

    • очистите старые зависимости перед переустановкой [рекомендуется]

      $: rm -rf node_modules

    • установить зависимости

      $: npm install

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

После того, как CLI был успешно обновлен вместе с его начальными зависимостями, не стесняйтесь обновлять и ваши дополнительные зависимости, которые не установлены по умолчанию (например, Angular Material).

$: npm update @angular/material ...
Источник

Оба ответа выше верны и основаны на том же подходе, который является де-факто на сегодняшний день.

Angular CLI планирует добавить функцию обновления в один из следующих выпусков.

Для обновления ваших дополнительных зависимостей есть элегантный способ, переместив их во второй package.json. Для этого вы можете использовать Yarn Workspaces или package-json-merge. Более подробная информация на моем сайте: https://www.rainerhahnekamp.com/en/updating-angular-cli-dependencies/

Источник
Другие вопросы по тегам